vue3组件传值

在项目中写组件是必然的,可以帮我们减少掉很多冗余的代码,我使用的是props属性进行传值,父组件向子组件传值

<el-dialog title="选择图片" :modal="false" v-model="dialogImageVisible" width="80%" append-to-body>
       <Wxmaterial :objData="objData" @selectMaterial="selectMaterial"></Wxmaterial>
                </el-dialog>

 在子组件中定义props接收,在setup中写是不用引入直接使用

const props = defineProps(["objData"])

子组件向父组件传值可以使用defineExpose来进行传值,想传什么放在里面,再在父组件用的时候使用ref接收,代码如下:

 <el-form-item label="回复消息">
      <WxReply :objData="objData" v-if="hackResetWxReplySelect" ref="def"></WxReply>
 </el-form-item>
 console.log(def.value);

直接就可以接收到子组件暴露出来的值

猜你喜欢

转载自blog.csdn.net/hy291/article/details/128974009