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、说明

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