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

2024-09-05 08:06:52

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

// 父组件

<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);

    }

}

最新文章

热门文章