vue 父子传参,vue子向父传参
这篇文章主要介绍了vue3.0父子传参，子修改父数据的实现方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
目录
父子传参，子修改父数据父组件子组件父子组件传值（语法糖)父子组件交互
父子传参，子修改父数据
父组件
父亲传值给儿子，儿子可以修改父亲的数据（同步)
模板
差异
父组件
{{ data }}
button @click=add()修改/按钮
人力资源/
子组件：儿子/
/div
/模板
脚本
从导入儿子.组件/子。vue ；
从“vue”导入{ provide，ref，shallowRef，readonly，shallow readonly }。
导出默认值{
组件：{
儿子，
},
setup() {
let data=ref( 123 )；
设updata=()={
data===
};
让add=()={
数据==12
}
提供( updata ，updata)；
提供("显示",数据);
返回{
数据，
更新数据，
增加
};
},
};
/脚本
style lang=less scoped/style
子组件
模板
div{{son}}/div
button @click=updataSon(12)更改/按钮
/模板
脚本
从“vue”导入{ ref，inject }；
导出默认值{
setup() {
const son=(inject( show ))；
const updataSon=inject(updata )
返回{
儿子，
更新数据
}
},
};
/脚本
style lang=less scoped/style
父子组件传值(语法糖)
父子组件交互
模板
El-icon:size= size :color= color @ click= change
组件：is= name /组件
/el-icon
/模板
脚本设置
从“vue”导入{ defineProps，defineEmits，defineExpose}
//定义传值类型
const props=defineProps({
名称：{
类型：字符串，
必填：真，
},
大小：{
类型：字符串，
默认值： ,
},
颜色：{
类型：字符串，
默认值： ,
},
})
//定义事件名
const emit=define发出([ change ])
//触发事件
常量更改=()={
发出( change ，{name:21231，data:456})
}
defineExpose({
改变，道具
})
/脚本
以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。