Vue數組更新
阿新 • • 發佈：2019-02-17
lis color 替代 dom元素 app click 數據 vue index <!-- 數組更新 7種 會改變原始數組的方法 push() pop() shift() unshift() splice() sort() reverse() Vue檢測到數據變化會更新視圖
不會改變原數組方法，可以使用新數組替代原數組 數組變化時，並不是直接渲染，而是最大的復用DOM元素， 替換數組的相同元素不會被重新渲染。無需擔心性能問題. filter() slice()
Vue不能檢測到 1，通過索引直接設置項 app.list[3] = {}; 2， 修改數組長度 app.list.length = 1 Vue.set(this.list, index, item);
過濾與排序 不想改變原數組，通過一個數組的副本做過濾或者排序、 可以使用計算屬性來返回過濾或排序後的數組
--> <ol> <li v-for="(item,index) in
不會改變原數組方法，可以使用新數組替代原數組 數組變化時，並不是直接渲染，而是最大的復用DOM元素， 替換數組的相同元素不會被重新渲染。無需擔心性能問題. filter() slice()
Vue不能檢測到 1，通過索引直接設置項 app.list[3] = {}; 2， 修改數組長度 app.list.length = 1 Vue.set(this.list, index, item);
過濾與排序 不想改變原數組，通過一個數組的副本做過濾或者排序、 可以使用計算屬性來返回過濾或排序後的數組
--> <ol> <li v-for="(item,index) in
methods: {
setList() { // this.list[2] = { name: "zhangsan2", age: 30 }; this.$set(this.list, 2, { name: "lisi", age: 30 }); } },
Vue數組更新