Subscribe on changes!

vue@3.2.25 The ref attribute generated by vbind string template has changed

avatar
Mar 15th 2022

Version

3.2.25 or 3.2.33

Reproduction link

Vue SFC Playground Demo

Steps to reproduce

choose Vue Version: 3.2.25 or Version: v3.2.33 click testRef button, see devtools get log

<input>
[input]
[input]

choose Vue Version: 3.2.24 click testRef button, see devtools get log

<input>
<input ref_for="true" placeholder="mInput0">
<input ref_for="true" placeholder="mInput1">

What is expected?

this.$refs["mInput0"] get dom . not be wrapped by array

What is actually happening?

Vue Version >= 3.2.25 this.$refs["mInput0"] get a [Array]

Vue Version <= 3.2.24 this.$refs["mInput0"] get dom

Originally by 'this.$refs["mInput0"]' the component object that can be accessed. The outer layer is wrapped with an array. I must use 'this.$refs["mInput0"][0]' to access

avatar
Mar 15th 2022
avatar
Mar 16th 2022

Your reproduction is not minimal, please read and follow https://new-issue.vuejs.org/?repo=vuejs/vue-next#why-repro when reporting a bug. Most bugs should be reproducible with the SFC Playground.

avatar
Apr 18th 2022

Your reproduction is not minimal, please read and follow https://new-issue.vuejs.org/?repo=vuejs/vue-next#why-repro when reporting a bug. Most bugs should be reproducible with the SFC Playground.

Really sorry,edited. There is still this problem on version 3.2.33, so I want to reopen issue

avatar
Apr 18th 2022

likely related to #5118

likely related to #5118

I edited demo. Is your repair already in the latest version 3.2.33? it doesn't seem to have any effect on me. It does seem to be a similar problem.

avatar
May 25th 2022

@posva can this be reopened? There is clear reproduction link now in first post.

Since Vue 3 has changed how refs work inside loops (old doc link in Russian): https://v3.ru.vuejs.org/ru/guide/migration/array-refs.html#frontmatter-title I don't see this mentioned in https://v3-migration.vuejs.org/migration-build.html#fully-compatible - there is no doc link for COMPILER_V_FOR_REF.

avatar
May 25th 2022

We decided to revert to Vue 2 behavior since the Vue 3 behavior was undesirable in most cases. The compat entry was also removed.