我使用vue(2.6.10)即时消息,我试图用vuetable2(2.0.0-beta.4)构建通用表。
我为vuetable的常规方法创建了一个组件。
我试图将我的“ MyCustomTemplate”放置在“ MyVueTable”的广告位部分,但没有出现错误,也没有显示任何内容。
我的目标是在其他vue页面中使用“ MyVueTable”并替换“ MyCustomTemplate”。
我目前在数据中有3个条目,但在List.vue组件中什么也没有显示
List.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>
答案 0 :(得分:0)
您可以测试将组件(在List.vue
中)放置在div或将成为广告位内容的模板中:
<template #nameOfYourSlot>
<NameOfYourComponent>
</template>
答案 1 :(得分:0)
此问题在官方存储库中得到了回答,您需要将其作为自定义全局组件:https://github.com/ratiw/vuetable-2-tutorial/wiki/lesson-17