vue 数组更新（push【可用】，$set，slice,filter,map【都属于浅拷贝】）问题

---

this.$axios.post('https://....php',this.$qs.stringify({
                user: 'suess'
            }))
            .then(res => {
                this.dataa = res.data; //这里的dataa视图不会更新，在其他函数里this.dataa没有值
		})

在Vue中中括号记法赋后，不会触发 updated，也就是视图没有更新。

用push, pop 等方法改变数组则可以，或者直接将指针指向一个新的数组，例如通过 slice,filter,map等方法返回的新数组，也会触发视图更新。

也可以通过Vue.$set()的办法来改变数组的值。

---

$set

ps：现在有两个数组，分别为arr1，arr2，如果arr1以下标赋值改变数组，arr2以$set改变数组，结果是什么样呢？

data:{

arr1 = ['a','b','c'];

arr2 = [‘foo','bar','baz'];

}

vm.arr1[1] = 'alpha';

vm.$set(vm.arr2, 1, 'alpha');

根据开始我们说的根据下标索引改变数组不能触发状态更新，我们会知道：第一个数组的第二项改变不会在页面更新，只有第二个数组的更改会在页面更新。然而结果却是：

arr1 = ['a', 'alpha', 'b', 'c'];

arr2 = [‘foo', 'alpha', 'bar','baz'];

两个数组的值都更新了，也就是说，arr2用$set()方法更新时，页面会全部更新一遍。

转自https://www.jb51.net/article/136049.htm

filter（）快速过滤创建一个新数组

var new_array = arr.filter(

callback(element[, index[, array]])[, thisArg]

)

var a = [1,2,3,4].filter(m => true)

a

(4) [1, 2, 3, 4]

var a = [1,2,3,4].filter(m => false)

a

[]

var a = [1,2,3,4].filter(m => m>2)

a

(2) [3, 4]

转自https://blog.csdn.net/weixin_30680385/article/details/98122329

map（）

(1) 返回一个经过处理后的新数组，但不改变原数组的值。

var a = [1,2,3,4,5]

var b = a.map((item) => {

return item = item * 2

})

console.log(a) // [1,2,3,4,5]

console.log(b) // [2,4,6,8,10]

转自https://www.jb51.net/article/150865.htm

---

循环push

方法1：循环push

for(var i in that.xuanzArr_beixuan){

that.xuanzArr.push([]);

}

方法2：解析JSON

JSON.parse(JSON.stringify(this.templateData))

转自https://www.cnblogs.com/shark1100913/p/12143534.html

---

slice（）

slice是指定在一个数组中的元素创建一个新的数组，即原数组不会变

var color = new Array('red','blue','yellow','black');

var color2 = color.slice(1,2);

alert(color); 　　//输出 red,blue,yellow,black

alert(color2); //输出 blue;注意：这里只有第二项一个值

https://blog.csdn.net/hbwang_716/article/details/118684011