如何将自定义nativescript-Vue组件传递给自定义子组件

Question

我想使用 Nativescript-Vue 将动态子组件添加到父组件。例如：

<template>
    <MyParentComponent>
        <MyChildComponent :foo="foo"></MyChildComponent>
    </MyParentComponent>
<template>

<script>
    import MyParentComponent from './components/MyParentComponent';
    import MyChildComponent from './components/MyChildComponent';

    export default {
        components: {
            MyParentComponent,
            MyChildComponent
        },
        data: function(){
            return {
                foo: ''
            }
        }
    }
</script>

我想我需要在父组件中定义一个插槽，在其中插入子组件，但我不知道应该如何完成。

有任何想法吗？

Answer 1

在MyParentComponent的模板中，您需要添加一个<slot />标签，Vue 将在其中插入内容。

在 Vue 文档中了解有关插槽及其功能的更多信息： https: //v2.vuejs.org/v2/guide/components.html#Content-Distribution-with-Slots