Vue: [2.0.0-rc.1] v-for and ref: $refs not reactive anymore?
In 2.0.0-rc.1, a construct like
<p>Count: {{$refs.components && $refs.components.length}}</p>
<sub-component v-for="item in items" ref="components">
is not working anymore (count stays at initial value, even if items and thus component count is changed). In v1, arrays of $refs would reactively update.
I am not sure if this is a bug or a feature, but #2873 does not seem to mention it.
WolfgangFellger
All 3 comments
This is intended - the reason is that $refs are now registered/updated during the render process itself. It's not recommended to rely on $refs in templates as they are intended only for programmatic access in JavaScript.
I've updated #2873 to include this.
yyx990803
on 17 Aug 2016
@yyx990803 does this mean that using this.$refs.* in computed properties will also stop working in v2 or is it just the use in templates? Do I have to solve all this with custom events?
I currently pass validation results from children to the parent like this.
toabi
on 19 Aug 2016
you can use this.$forceUpdate() and setTimeout to rerender the view when you update the data and find that $refs not reactively update.
this.fetchSomeShit()
.then((data) => {
this.data = data
setTimeout(() => {
this.$forceUpdate()
})
})
use setTimeout to ensure the data has been given in what they say the vue taskqueue
FTAndy
on 4 May 2017
Related issues
robertleeplummerjr
·
3Comments
bfis
·
3Comments
loki0609
·
3Comments
hiendv
·
3Comments
aviggngyv
·
3Comments
Most helpful comment
@yyx990803 does this mean that using
this.$refs.*incomputedproperties will also stop working in v2 or is it just the use in templates? Do I have to solve all this with custom events?I currently pass validation results from children to the parent like this.