博主:DongJiang
码龄:7年
等级:
文章:631
访问:52336
博客简介:DongJiang的博客
博客创建时间:2018-04-12
给博主送颗小红心
1002
后台管理系统: 进入后台

Vue3父组件与子组件双向数据传值展示和修改

子组件中通过computed计算属性监测到值变化后,向父组件发送消息并更改父组件值

1、父组件引用子组件使用双向数据绑定[v-model:content=content]

2、组件通过props读取父组件的content字段

3、并通过computed计算属性获取值并赋予一个变量,然后再将变量绑定到表单上。此时当子组件表单值发生改变后,computed会重新计算并把最新的值通过emit向父组件传递值,因此达到了子组件更改父组件传值

const value: any = computed({
      get: () => props.content,
      set: (val) => context.emit('update:content', val)
});
原文出处:
版权声明:本文来源地址若非本站均为转载,若侵害到您的权利,请及时联系我们,我们会在第一时间进行处理。