v-once for component tag doesn't work in v-for

[hydroDude]

Version

2.5.16

Reproduction link

https://jsfiddle.net/hL0rrbs9/6/

Steps to reproduce

Run code, and watch.

What is expected?

"Yay Yay ;)" values should not change to "hell naw!" in 3 seconds.

What is actually happening?

"Yay Yay ;)" values are changing in to "hell naw!" in 3 seconds.

---

Wait 3 seconds. Behavior is not consistent. "component" tag in v-for should not change.

{{comp}}

{{comp}}

<script> var z = new Vue({ el: "#app", data: { comp: "comp1", items: [{id:1}, {id:2}] }, components: { "comp1": { template: "

yay yay ;)

" }, "comp2": { template: "

hell naw!

" } } });

setTimeout(function() {
z.comp = "comp2"
}, 3000);
</script>

[yaodingyd]

v-once should be in v-for, not in its children.

[hydroDude]

1. If v-once is in v-for, the iteration is rendered once. Ex: If there are 2 children originally, and a child is added later, the 3rd child is not rendered. This is not the scenario.

2. if :key is provided to v-for, the idea is to patch each element in-place. Ex: In 1st item's example, the existing 2 children are not re-rendered. Hence the binding persists.

3. In my JSFiddle example,

   {{comp}}

   is behaving as expected in v-for. v-once is placed in v-for's child. "comp1" text does not change to "comp2".

4. In my JSFiddle example, component is NOT behaving as expected in v-for. v-once is placed in v-for's child. "yay yay ;)" text does change to "hell naw!". This is the bug.

Given above, the expected behavior for v-for to still be bound to data and render when children array count changes. But each child to render only once. In this scenario, the v-once behavior is required in children, not the parent.

In short, this behavior is currently consistent except for component element. JS line 10 is working fine. Line 9 is not.