Skip to content

Value inside v-slot in a v-for won't update #9506

Closed
@jedrula

Description

@jedrula

Version

2.6.0

Reproduction link

https://github.com/jedrula/slot-updates-on-vue-2.6
jsfiddle: http://jsfiddle.net/sj8wcx0k/

Steps to reproduce

You can see the problem on a deployed version of https://github.com/jedrula/slot-updates-on-vue-2.6 here: http://slot-updates-vue-26.surge.sh/

You run into a problem like that if

  1. you have a v-slot inside a v-for and in that v-slot you render an item from v-for
  2. you update whole array that drives the v-for

What is expected?

Rendered item in v-for should behave in a same way as rendered item in v-for inside a v-slot - it should be re-rendered when the whole array driving the v-for changes.

I'd expect no changes in behavior from Vue 2.5.22. You can see how it behaves on the same code with vue 2.5.22. I have deployed same code with downgraded Vue version here: http://slot-updates-vue-25.surge.sh/

What is actually happening?

The item inside v-for in a v-slot is not re-rendered:
https://github.com/jedrula/slot-updates-on-vue-2.6/blob/master/src/App.vue#L6


I know that the issue can be resolved by providing proper v-key to the v-for. The confusing part though is that the even without the v-key this line is updated: https://github.com/jedrula/slot-updates-on-vue-2.6/blob/master/src/App.vue#L4 but this line is not: https://github.com/jedrula/slot-updates-on-vue-2.6/blob/master/src/App.vue#L6.

If that's not a bug but something I don't understand about scoped slots it might be good to add some information about that in some Vue reactivity gotchas ? I wonder why it bit me given a change from 2.5 -> 2.6 should not be breaking.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions