Vuetable2 слот в слоте - PullRequest
Новая
       7

Vuetable2 слот в слоте

0 голосов
/ 13 января 2020

Я использую vue (2.6.10), и я пытаюсь построить универсальную таблицу с vuetable2 (2.0.0-beta.4).

Я создал компонент для общих методов vuetable.

Я пытался поместить мой MyCustomTemplate в раздел слотов MyVueTable, но я не получил ошибку, и ничего не отображается.

Моя цель - использовать MyVueTable в другие vue страниц и замените «MyCustomTemplate».

В настоящее время у меня есть 3 записи в моих данных, но в списке. vue компонент ничего не отображается

Список. vue 

<template>
    <MyVueTable :data="data" :fields="fields">
        <MyCustomTemplate v-slot="vueTableTemplateSlot"/>
    </MyVueTable>
</template

<script>
export default {
    name:"List",
    data(){
        return{
            data: [],
            fields: [
                {
                    name: 'vueTableTemplateSlot'
                }
            ]
        };
    }
}
</script>

MyVueTable. vue

<template>
    <vuetable ref="vuetable">
        <slot name="vueTableTemplateSlot" slot-scope="props"/>
    </vuetable>
</template>
<script>
    export default {
        name: 'MyVueTable',
        props: ['data', 'fields'],
        methods:{
            //vuetable methods
        }
    }
</script>

MyCustomTemplate. vue

<template>
    <div>
        {{rowData.id}}
    </div>
</template>
<script>
    export default {
        name: 'MyCustomTemplate',
        data(){
            return{
                rowData: null
            }
        }
</script>

1 Ответ

0 голосов
/ 13 января 2020

Вы можете проверить, чтобы поместить ваш компонент (в List.vue) в div или шаблон, который будет содержимым слота: 

<template #nameOfYourSlot>
      <NameOfYourComponent>
</template>
...