vue中肯定遇到过这个问题,想对数组操作,可是原数组又会改变,怎么办呢,提前copy一份能行吗,

todo: [1,2,3,4,5],

var arr = this.todo;

这样肯定不行的,那么肯定是新建数组循环添加,把老数组的元素全部添加到新数组里。

var newArr =  [];

todo.forEach(function(e,i){
  newArr.push(e);
})

然后拿到新数组去操作,有点麻烦,就可以用到计算属性。

computed:{
changeTodo: function(){
return this.todo.filter(function(number){
return number%2 ===0
})
}
}

这样就得到了新数组也不会改变老数组的内容。

计算属性不适用的时候可以换成methods方法来使用。

vue 操作数组,原数组怎么不让它改变的更多相关文章

  1. 将0移到最后,在原数组操作,并且不能改变源数据顺序(JS编程)

    一.问题描述: 将0移到最后,在原数组操作,并且不能改变源数据顺序. 示例:输入:[2,0,0,1,0,3],  结果:[2,1,3,0,0,0] 二.问题分析与解决: 注意是在原数组上操作,不要进行 ...

  2. vue操作数组时遇到的坑

    用vue操作数组时,一般就那几个方法,而且是可以渲染的,但是有时候列表是渲染不了的先说下操作数组的几个方法吧 1 push ( ) 这个方法是在数组的最后面添加元素 用法:  括号里写需要加入的元素  ...

  3. js操作改变原数组的解决方法

    最近在开发的时候发现js中的循环操作会改变原数组,var一个变量承接也不行 甚至连map方法都会改变原数组,下面是解决方法 let a = ['a','b','c'] let b = [[2, 0, ...

  4. JavaScript jQuery 中定义数组与操作及jquery数组操作

    首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象Javascript不支持多 ...

  5. bit-map牛刀小试:数组test[X]的值所有在区间[1, 8000]中, 现要输出test中反复的数。要求:1. 不能改变原数组; 2.时间复杂度为O(X);3.除test外空间不超过1KB

    先来看看这个题目:数组test[X]的值所有在区间[1, 8000]中. 现要输出test中反复的数.要求:1. 不能改变原数组; 2.时间复杂度为O(X);3.除test外空间不超过1KB. 好, ...

  6. numpy 多维数组及数组操作

    NumPy是Python语言的一个扩充程序库.支持高级大量的维度数组与矩阵运算,此外也针对数组运算提供大量的数学函数库.Numpy内部解除了Python的PIL(全局解释器锁),运算效率极好,是大量机 ...

  7. 从vue渲染想到的数组方法

    <div id="app"> <ul> <li v-for='item in goods'>{{item}}</li> </u ...

  8. php数组函数有哪些操作?php数组函数的应用

    PHP 的数组是一种很强大的数据类型,与此同时 PHP 内置了一系列与数组相关的函数可以很轻易的实现日常开发的功能.但是我发现好像很多小伙伴都忽略了内置函数的作用(比如我自己就编写过一些有关数组操作的 ...

  9. js数组方法 改变原数组和不改变原数组的方法整理

    改变原数组: pop():   删除 arrayObject 的最后一个元素,把数组长度减 1,并且返回它删除的元素的值.如果数组已经为空,则 pop() 不 改变数组,并返回 undefined 值 ...

随机推荐

  1. 基于嵌入式Linux的千兆以太网卡驱动程序设计及测试

    一. 引言 千兆以太网是一种具有高带宽和高响应的新网络技术,相关协议遵循IEEE 802.3规范标准.采用和10M以太网相似的帧格式.网络协议和布线系统,基于光纤和短距离同轴电缆的物理层介质,更适用于 ...

  2. C#中使用Spire.docx操作Word文档

    使用docx一段时间之后,一些地方还是不方便,然后就尝试寻找一种更加简便的方法. 之前有尝试过使用Npoi操作word表格,但是太烦人了,随后放弃,然后发现免费版本的spire不错,并且在莫种程度上比 ...

  3. 第三视角团队:项目UML设计(团队)

    项目UML设计(团队) 团队信息 团队名:第三视角 各成员学号及姓名 姓名 学号 博客链接 张扬(组长) 031602345 http://www.cnblogs.com/sxZhangYang/p/ ...

  4. centos7 sftp设置后 ssh 启动失败 原因分析

    大多数人 在 设置SFTP 使用时,会在 ../sshd_config中添加如下内容: ------------------------------- Subsystem sftp internal- ...

  5. L1-005 考试座位号

    每个 PAT 考生在参加考试时都会被分配两个座位号,一个是试机座位,一个是考试座位.正常情况下,考生在入场时先得到试机座位号码,入座进入试机状态后,系统会显示该考生的考试座位号码,考试时考生需要换到考 ...

  6. 记python3 UnicodeEncodeError: 'latin-1' codec... 报错

    python3用cx_Oracle查询oracle数据库并打印输出,在windows上执行没问题,打算放suse上跑的时候就遇到了打印中文UnicodeEncodeError: 'latin-1' c ...

  7. 建立自己的javaBean --成功

    1.用记事本新建一个java 程序,文件名为TestBean.java ,文件内容如下: package test; public class TestBean{ private String nam ...

  8. Bootstrap CustomBox 弹层

    这个模态窗口插件使用原生javascript制作,它也可以和jQuery完美的结合.请注意:这些模态窗口动画仅仅工作在支持各自CSS3属性的浏览器上.Internet Explorer 8 和 9需要 ...

  9. UI基础:UIControl及其子类

    UISegmentedControl  UISegmentedControl 是iOS中的分段控件 每个segment 都能被点击,相当于集成了若干个button. 通常我们会点击不同的segment ...

  10. Android利用反射机制为实体类属性赋值

    在做android项目时,有时会遇到从网络上获取json类型数据,赋值给实体类,实体类属性少可以一个一个的赋值,如果实体类有很多属性,赋值可能就要耗很长的功夫了,幸好Java给我们提供了反射机制.下面 ...