VUE中数组赋值push与=的区别

最近做项目时（vue2.0）遇到此坑耗费不少时间，分享如下:

data中定义初始结构：

data:function(){
return {
optionsArr: [{name: '', edit: false}],
}
}
1
2
3
4
5
script中：

for (let i = 0; i < this.flow.dicts.length; i++) {
this.optionsArr[i] = {name: this.flow.dicts[i].label, edit: false}
}
console.log(this.optionsArr)
1
2
3
4

修改为：

for (let i = 0; i < this.flow.dicts.length; i++) {
//即采用push去添加元素
this.optionsArr.push({name: that.flow.dicts[i].label, edit: false})
}
console.log(this.optionsArr)
1
2
3
4
5

template中：
想通过点击事件改变edit为true

<li v-for="(option,index) in optionsArr">
<span v-show="!option.edit" v-on:click="option.edit = !option.edit">{{option.name}}</span>
</li>
1
2
3
用这两种方法，optionsArr最后都是长度为二的数组，但是push添加的元素具有set和get方法，这样想通过点击改变edit值时可以生效的，而直接赋值添加的元素点击改变edit不生效，在vue的点击事件改变某属性时这是需要特别注意的问题。
---------------------
版权声明：本文为CSDN博主「wangbinXMU」的原创文章，遵循CC 4.0 by-sa版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/wangbinxmu/article/details/79872037

转载于:https://my.oschina.net/u/3358860/blog/3090046

VUE中数组赋值push与=的区别相关推荐

Vue中数组赋值问题
出现的问题昨天工作内遇到的问题,用输入arrList渲染了一个表格,修改了arrList,然而列表没有改变. Vue 不是双向绑定吗?怎么回事?what's fuck 值变了? 列表没有变??? 测 ...
python定义数组并赋值_python中的数组赋值与拷贝的区别详解
具体的注解我已经写在了程序里面:通俗的解释了python里面的浅拷贝与深拷贝的不同,请看程序. # -*- coding: utf-8 -*- import numpy as np import co ...
Vue中数组变动监听
Vue中数组变动监听 Vue的通过数据劫持的方式实现数据的双向绑定,即使用Object.defineProperty()来实现对属性的劫持,但是Object.defineProperty()中的set ...
vue中数组的七个响应式方法
vue中数组的七个响应式方法起因: 在使用vue实习中,通过数组的索引改变了数组中的值,测试时发现,更改成功了,但是试图无响应. 原因: *通过索引值修改数组元素,不是响应式方法* // 以下代 ...
从编译器角度分析C语言中数组名和指针的区别
从编译器角度分析C语言中数组名和指针的区别数组名和指针是两个往往很容易让人们混淆的概念,很多人以为数组名就是一个指针,也有很多人知道数组名不同于指针但是仅知道数组名的值不能像指针一样改变. 例如你可 ...
java中数组赋值方法
Java中数组赋值方法,以及为什么不能使用a = b //这里定义两个长度相同的数组,其中数组二为空 int[] arr1 = new int[]{1,2,3,4,5,6,0,0,0,0}; int[ ...
Vue中this.$router.push路由跳转,刷新参数消失
Vue中this.$router.push路由跳转,刷新参数消失 this.$router.push({name:"",params:{id:""}}) nam ...
Vue中数组push问题
最近在Vue框架中使用数组push遇到两个坑 1. 向数组中push后,无法获取到数组中的属性值数组赋值: ...... res.data.forEach((item,index) => { ...
php n维数组扁平化,js嵌套的数组扁平化:将多维数组变成一维数组以及push()与concat()区别的讲解...
数组的扁平化:将多维数组变成一维数组对于一个像这样的嵌套数组:a=[1,[2,[3,4]],5,6]我们想要把它变成一个一维数组,有下面几种方法: 方法一:递归一 function parseArr ...

VUE中数组赋值push与=的区别

VUE中数组赋值push与=的区别相关推荐

最新文章

热门文章