Vue: переход от слотов к v-слоту для Vue 3

#vue.js #vuejs2 #vuejs3

Вопрос:

В настоящее время я использую простую реализацию слотов в Vue 2. У меня есть родительский компонент, который использует MyComponent и вставляет OtherComponent . Мой MyComponent код использует <slot></slot> для содержимого. Как бы я внес изменения в слоты, чтобы адаптироваться к Vue 3 v-slot , так slot как он устарел?

Родитель.vue

 <MyComponent>
    <template v-slot="slotProps">
       <OtherComponent
          :data="slotProps.data"
       >
       </OtherComponent>
   </template>
</MyComponent>
 

МиКомпонент.vue

 <template>
    <div class="container">
       <template v-for="(item, index) in data">
            <slot :item="item"></slot>
       </template>
    </div>
</template>
 

Комментарии:

1.В опубликованном вами коде не требуется никаких изменений. Это slot атрибут slot-scope атрибут), для которого не рекомендуется v-slot использовать . Parent.vue уже использует более новый синтаксис, поэтому здесь ничего не нужно переносить.

2. отлично, спасибо @tony19