vue双向绑定不起作用神坑


转自:https://www.jianshu.com/p/6164d384dce5

神坑描述:

前端vue在做双向绑定时,如果采用的是 二级属性绑定 ,并且在声明时 仅声明了一级属性,那么在这种情况下,如果 首次赋值 不是通过页面交互录入,而是 通过程序赋值 ,并且赋值时采用直接给二级属性单独赋值 ,就会产生双向绑定失效的情况;

解决办法:

// 此方式首次赋值(页面刚打开或刷新后首次赋值) 有问题
this.people.name = "XX";

// 规避方法一(可能覆盖掉一些需要初始化的数据)
this.people = {name: "XX"};
XX
// 规避方法二,推荐(无副作用)
this.$set(this.people, 'name', 'XX')

// 规避方法三(无副作用)XX
let oldEntity = JSON.parse(JSON.stringify(this.people));
Object.assign(oldEntity, newPeople);
this.people = oldEntity;

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM