En mi aplicación VueJs 2, estoy refactorizando mi código que se usa con ranuras con nombre (para seguir las recomendaciones ya que el atributo :slot está en desuso) de:

 <CustomComponent> <div slot="named-slot">foo</div> </CustomComponent>

a:

 <CustomComponent> <template #named-slot> <div>foo</div> </template> </CustomComponent>

Pero tengo un problema con las ranuras dinámicas. Antes tenía:

 <Slider :nb-slides="3"> <Slide v-for="n in 3" :key="n" :slot"`slide-${n}`" :someDynamicProp="..."> </Slider>

Y al refactorizar código, tengo algunos problemas con :key . Si pongo :key en plantilla:

 <Slider :nb-slides="3"> <template v-for="n in 3" :key="n" #[`slide-${n}`] > <Slide :someDynamicProp="..."> </template> </Slider>

Tuve el siguiente error:

 ERROR Failed to compile with 1 errors Module Error (from ./node_modules/vue-loader/lib/loaders/templateLoader.js): (Emitted value instead of an instance of Error) Errors compiling template: <template> cannot be keyed. Place the key on real elements instead.

Y si pongo :key en el elemento concreto Slide:

 <Slider :nb-slides="3"> <template v-for="n in 3" #[`slide-${n}`] > <Slide :key="n" :someDynamicProp="..."> </template> </Slider>

Tuve el siguiente error:

 error `<template v-for>` key should be placed on the `<template>` tag vue/no-v-for-template-key-on-child

Como el segundo error es un error de EsLint, decidí agregar <!-- eslint-disable vue/no-v-for-template-key-on-child --> comentario para poder compilar, pero estoy preguntándose cuál es la mejor práctica en este caso?