vue 作用域插槽

1、示例代码

<template>
    <div class="parent">
        <child>
            <template slot-scope="a">
                <p>hello from parent</p>
                <p>{{ a.say }}</p>
            </template>
        </child>
    </div>
</template>
<script> import Vue from 'vue' Vue.component('child', { template: '\ <div class = "child" > \ <slot say = "hello from child" > < /slot>\ </div>' }); export default { data() { return { } }, methods: { } } </script>

2、效果

3、说明

渲染子组件的内容，将子组件数据传递到插槽。