在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue 數(shù)組對象的修改

vue 數(shù)組對象的修改

根據(jù)vue官方文檔,直接修改數(shù)組的值,將無法更改view層,可以使用$set來實現(xiàn)。那么數(shù)組內(nèi)的對象如何修改呢,是使用$set來修改,還是直接使用數(shù)組下標的方式修改。
為什么我現(xiàn)在直接使用數(shù)組下標的方式修改也能觸發(fā)view更新呢?

回答
編輯回答
櫻花霓

vue是沒有監(jiān)聽下標賦值的操作也無法監(jiān)聽
下面這種是無法監(jiān)聽的

var arr = ["a","b"];
arr[1] = "bbbb";

vue只監(jiān)聽了'push','pop','shift','unshift','splice','sort','reverse'等直接改變原數(shù)組的方法
$set,內(nèi)部還是splice方法

function set(target, key, val) {
    if (Array.isArray(target) && typeof key === 'number') {
      target.length = Math.max(target.length, key);
      target.splice(key, 1, val);
      return val
    }
    //其他操作  
    ...  
}

但是如果你的結構下面:

var arr = ["a",{text:"b"}];
arr[1].text = "bbbbb";

因為對數(shù)據(jù)進行了遞歸 對象的賦值是可以直接監(jiān)聽到的
但是下面又不行了

var arr = ["a",{text:"b"}];
arr[1] = {text:"bbbbb"};

總結來說不要數(shù)組下標直接賦值

var arr = ["a",{text:"b"}];
this.arr[1] = {text:"bbbbb"};//除了這種以下都可以
this.arr[1].text = "bbbbb";//利用對象的監(jiān)聽
this.arr = ["a",{text:"bbbbb"}];//同上
this.arr.splice(1, 1, {text:"bbbbb"});//數(shù)組的監(jiān)聽
this.$set(this.arr,1,{text:"bbbbb"});//同上
2018年4月30日 13:01
編輯回答
硬扛

文檔中提到了這幾點:

由于 JavaScript 的限制,Vue 不能檢測以下變動的數(shù)組:

  1. 當你利用索引直接設置一個項時,例如:vm.items[indexOfItem] = newValue
  2. 當你修改數(shù)組的長度時,例如:vm.items.length = newLength

其中你的疑問是第一點吧?文檔的意思是比如現(xiàn)在有一個數(shù)組arr,內(nèi)容是[1,2,3],然后你想要加多一項,然后arr[3] = 4,這個時候Vue是檢測不到的,而且arr[0] = 666也不行。數(shù)組內(nèi)的對象的內(nèi)容只要一開始添加了,就可以直接arr[index].key = val這樣改,如果是一開始沒有添加,那就要用$set添加。至于你說的可以監(jiān)聽到,可以發(fā)一個demo看一下

2017年10月27日 03:34