Version

3.2.26

Reproduction link

sfc.vuejs.org/

Steps to reproduce

Create [transition-group tag="div"] Put inside a [template v-for="..." ] with required :key Put inside [template] a [div] Put inside [template] an iterating [div v-for="..."] with required :key

What is expected?

This should work without warnings

What is actually happening?

It gets the warning: [TransitionGroup] children must be keyed.

Porting a Vue2 component i found the problem dealing with a [template v-for] inside a [transition-group]. The cause is the different key management: [template] don't want keys on its children (they have to be moved inside [template] tag) but [transition-group] still want every children to be keyed. The result as you can see, is that you receive a warning [TransitionGroup] children must be keyed.

But if I try to put keys on [transition-group] children (which are actually children of [template]) you get a compile error: SyntaxError: [template v-for] key should be placed on the [template] tag

Duplicate of https://github.com/vuejs/vue-next/issues/4718