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

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

Activity

changed the title the div which has the ref attribute inside the v-for, when I v-if toggle them, the ref value increase more and more 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 on Sep 18, 2023
edison1105

edison1105 commented on Sep 19, 2023

@edison1105
Member

a workaround:

<div v-for="(vv0, index0) in 3" :key="index0" ref="refDivArr">
+<div v-for="(vv0, index0) in 3" ref="refDivArr">
	<CompB ref="refCompArr"></CompB>
</div>
Alfred-Skyblue

Alfred-Skyblue commented on Sep 20, 2023

@Alfred-Skyblue
Member

Fixed in #9240 @hisland

2840365628

2840365628 commented on Jul 23, 2024

@2840365628

Fixed in #9240 @hisland

#11424

请问这是否和我的问题有关

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

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

    Participants

    @hisland@edison1105@Alfred-Skyblue@2840365628

    Issue actions

      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 · Issue #9239 · vuejs/core