vue3 插槽父传子、子传父

最新推荐文章于 2024-05-13 10:16:48 发布

Lucky_zss

最新推荐文章于 2024-05-13 10:16:48 发布

阅读量327

点赞数 3

文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/zss_base/article/details/138571126

版权

//子组件

<template>
  <div>
    <div ref="chart" style="width: 600px; height: 400px"></div>
    <button @click="parents">点击</button>
    <!-- 插槽 -->
      <slot name="child">子组件插槽</slot>
      <!-- 插槽中 子传父 -->
      <slot :data="{text:'999'}"></slot>
  </div>
</template>



//父组件

 <template #child>
        <p>111223</p>
      </template>
      <template #default="{data}">
        <div>{{ data.text }}</div>
      </template>