In my VueJs 2 application, I'm refactoring my code that use with named slots (to follow recommendations as :slot attribute is deprecated) from:

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

to:

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

But I have a problem with dynamic slots. Before, I had:

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

And when refactoring code, I have some issues with :key. If I put :key in template:

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

I got the following 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.

And if I put :key in the concrete element Slide:

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

I got the following error:

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

So as the second error is an EsLint error, I decided to add <!-- eslint-disable vue/no-v-for-template-key-on-child --> comment to be able to build, but I'm wondering what is the best pratice in this case?