@egyptForce

Как рендерить содержимое слотов вручную?

Есть такая структура:
<parent>
  <comp1 slot="foo"/>
  <comp2 slot="bar"/>
  <comp3 slot="qux"/>
</parent>


В родителе я соответсвенно сожержимое этих слотов получаю вот так:
//parent.vue

this.$slots.foo
this.$slots.bar
this.$slots.qux


Теперь мне нужно каждый из них отрендрить в <component> и передать данные, делаю вот так:
//parent.vue

<div v-for="data in dataset">
  <component v-for="item in items" :is="$slots[item.slotname]" :data="data"/>
</div>
но получаю ошибку:
[Vue warn]: The "data" option should be a function that returns a per-instance value in component definitions. vue.runtime.esm.js:587
[Vue warn]: Failed to mount component: template or render function not defined.


пытался в атрибут :is возвращать значение из render(h) => h(...) но не получаетсяя коррекнто передать данные в компонент из dataset
  • Вопрос задан
  • 182 просмотра
Пригласить эксперта
Ответы на вопрос 1
kleinmaximus
@kleinmaximus
Senior Full-stack Javascript Developer
А проще нельзя?

// parent.vue
<template>
  <slot name="foo"/>
  <slot name="bar"/>
  <slot name="qux"/>
</template>
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы