vue父子组件——具名插槽

<!-- 子组件 -->
<template>
    <div class='container'>
        <div>子组件</div>
        <slot name="up"></slot>
        <slot name="down"></slot>
    </div>
</template>
<!-- 父组件 -->
<template>
    <div class='container'>
        <div>父组件</div>
        <Child ref="child">
            <div slot="up">Hello World</div>

            <div slot="down">Hello China</div>
        </Child>
    </div>
</template>

<script>
    import Child from '@/components/Child'
    export default {
        components: { Child }
    }
</script>
©️2020 CSDN 皮肤主题: 编程工作室 设计师:CSDN官方博客 返回首页
实付 19.90元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值