2021-03-25 VUE 子组件修改父组件的值

1、通过事件发送给父组件来修改
在子组件test1中

添加

{{item}}

...
methods: {
add() {
// 直接把数据发送给父组件
this. ... addBook(val) { this.books = new Array(val) }, •2、使用.sync 来让子组件修改父组件的值(其实是上面方法的精简版) **在父组件中,直接在需要传递的属性后面加上.sync** **在子组件中**
3、在子组件中拷贝一份副本
子组件中
export default {
props: {
// 已经选中的
checkModalGroup: {
type: Array,
default: [],
required: false,
}
},
data() {
return{
copyCheckModalGroup: this.checkModalGroup, // 选中的
}
},
methods: {
// 一个一个的选择
checkAllGroupChange(data) {
// 把当前的发送给父组件
this.$emit('updata', data);
},
},
watch: {
checkModalGroup(newVal, oldVal) {
this.copyCheckModalGroup = newVal;
}
}
}
父组件中直接更新传递给子组件的数据就可以
...
// 更新子组件数据
roleCheckUpdata(data) {
this.roleGroup = data;
},
...
https://www.jb51.net/article/142021.htm