转: https://www.cnblogs.com/KevinTseng/p/12427486.html
原因分析
原因 1: 存在 this 指向问题, 没有真正更新到 data
原因 2:vue 不能检测对象属性的添加或删除
原因 3: 更新的层级太深
解决方法
处理原因 3: 建议对象层级设计时尽量扁平化
方法一: 使用强制刷新
- var self = this;
- self.tempalte.hobby.games.football.color = 'blue';
- self.$forceUpdate();
方法二: 创建一个指向深层级的变量, 然后直接更新该变量
- data: {
- tempalte: {
- hobby: {
- games: {
- football:{
- color: ''
- }
- }
- }
- }
- },
- mounted: {
- var self = this;
- self.footballColor = self.tempalte.hobby.games.football.color;
- },
- methods: {
- setFootballColor: function(color){
- var self = this;
- self.footballColor = color;
- }
- }
end.
来源: http://www.bubuko.com/infodetail-3459768.html