vue使用v-model绑定数组,页面无反应

- 原因

因为vue实现双向数据绑定的机制是数据劫持,也就是在所有对象上有个Object.defineProperty()方法,通过监听set,get方法去实现,而数组没有这两个方法,所以就不会更新view;解决方案就是,需要我们主动通知vue;

注意:xx[1]=787; 这种就是典型的vu无法劫持的赋值方式

- 解决办法

methods:{
    change(){
        this.aas[3] = 444;
        // 在vm实例上通知
        vm.$set(this.xx,3,this.xx[3])
    }
}
methods:{
    change(){
        this.aas[3] = 444;
        // 在全局对象上通知
        Vue.set(this.xx,3,this.xx[3])
    }
}

3.推荐使用

 methods:{
    change(){
        // vue本身可以监听到数组的一些方法,例如:
        // push(),pop(),shift(),unshift(),splice(),sort(),reverse()
        this.xx.splice(3,1,"");
    }
}

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值