uniapp组件封装之slot(插槽)使用

Posted 2022-12-16 前端薛小帅

需求：我们需要封装一个组件A，当父组件调用该组件时，可以传入插槽a，并且可以使用组件A抛出来的数据

<!-- 组件A -->
<template>
    <view>
        Hello World!
        <!-- 插槽a -->
        <slot name="a" :scope=" message:'抛出来的数据' "></slot>
    </view>
</template>

<!-- 父组件 -->
<template>
    <A>
        <view slot="a" slot-scope=" scope ">
            <!-- 这样就可以渲染出来我们组件A通过插槽抛给父组件的message -->
             scope.message 
        </view>
    </A>
</template>

 欢迎关注我的公众号：            欢迎关注我的抖音：