Skip to content

the div which has the ref attribute inside the v-for, when I v-if toggle them, the ref value.length increase more and more #9239

Open
@hisland

Description

@hisland

Vue version

3.2.47

Link to minimal reproduction

https://play.vuejs.org/#eNqtVUtv00AQ/iuDOSSV0qSot9QttNADSDxEERfMwbUnzjab3dU+3ESR/zuz68R2nNIglR6a3Z1v5pu3N9G1UuPSYTSNYpNppiwYtE4BT0VxmUTWJNFVIthSSW1hAxpnI/qXZpaVOAIpPksnLOYjyORSuXB6TG02hwpmWi5hQMYHjYH3BLrZCsaTcPPsBEhEJoWxwMxPZtg9R7j0ZEOrHZ4kYuYEUUoBVhYFxy1meAKbRECrNC5T7rzqq95TIqqWg+x+YOUdE2RpSyMc50TTyL1rTwH2TVxrvRX/+t3X7sniSZ1eSmZscal4apHOAHHOSjB2zZHSfS91jnoKb9QKjOQsh9eIeAEqzXPyhgRnahUqAvTnVa+6wUxhE0rURldV8cSj9hXa6HYanXh7KnMNk0M+im7MURR23uFsH5/hPdTcfz3G3zYIabeXtzBYoxnAFAZCDvpG7p211DzvMs6yhW/rbhdRPvfu8aSGk3LLC+Upm5Fmw5hETdXmyIq59cWh6lzAYRGV0yrw1PYATEj17hbsUyLIVLd4HTxh6tFpUG3BCBbXo9TA92Lv1eFlgTCx6LiVap2u96IoT2dSk6VhWZ6NgIkcV2cn9AvnRDNd4Nozh1e6d0OmBjgab435t2B3p3jSmbY4BAomkwrz3YrjaPySowH1QkJFI1p7NMszVowfjBS0G8OWSSK/4xhH/VX5XURa1MI1cRKlnMvHT+HN76zR7j2bY7Z44v3B0CBP6fBNo0FdUh0amU11gbYW3959wRWdG+FS5s5X7Rnhd6RyOe9jDbtxIie3O7jg7cewlKmJfpjblUVhdkF5Rz2yCvgkohXtc/630Ft3z8fnQY/WLWWx2e//7+vS+6wkosEM6WNweQWb6uiyzXhqDLE/6lT52UdjX9It1R+VZ24c

Steps to reproduce

if I click toggleVisible many times,

  1. the refDivSingle toggle between null and div
  2. the refCompSingle toggle between null and {}
  3. the refDivArr.length increase more and more <-- error here
  4. the refCompArr.length toggle between 3 and 0

if I use ref function, it don't get null
image

What is expected?

the refDivArr.length should toggle between 3 and 0, same as the refCompArr.length

What is actually happening?

the refDivArr.length increase more and more

System Info

No response

Any additional comments?

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    🐞 bugSomething isn't workinghas workaroundA workaround has been found to avoid the problem

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions