vue组件中的.sync修饰符使用

在vue的组件通信props中,一般情况下,数据都是单向的,子组件不会更改父组件的值,那么vue提供.sync作为双向传递的关键字,实现了父组件的变动会传递给子组件,而子组件的carts改变时,通过事件机制,修改父组件的cart。完成了子组件carts和父组件cart的双向映射。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// 父组件
<addicon :cart.sync="cart"></addicon>

//子组件
props: ['cart'],
data: function () {
return {
carts: this.cart;
}
},
methods:{
add:function(){
this.carts=10;
this.$emit('update:cart',this.carts);
}
}
#

评论

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×