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. html-中文字体在CSS中的显示(Unicode编码)(转载)

    为了方便需要的朋友快速使用,下表中列出了一些常用中文字体的Unicode编码: 宋体                   SimSun     \5B8B\4F53黑体                ...

  2. InstallShield中打包ArcEnineRuntime

    InstallShield中打包ArcEnineRuntime 最近研究了一阵应用程序的打包,几天下来也算颇有收获.普通的.net程序打包相对简单一点,不过ArcEngine的应用程序还涉及到Engi ...

  3. 官网下载的spring-framework的一些描述

    刚下载下来是这个文件夹:

  4. PAIR PROJECTS 附加题

    [附加题] 改进电梯调度的interface 设计, 让它更好地反映现实, 更能让学生练习算法, 更好地实现信息隐藏和信息共享. 答:首先,就原有的StopAtEach方法而言,此算法的实现既是非常低 ...

  5. L220

    He must not allow this unusual barrier (obstacle) to stop him from fighting against the enemy.他绝不能让这 ...

  6. L213

    The world lost seven astronauts of Space Shuttle Columbia(哥伦比亚号航天飞机) this month. It broughthome the ...

  7. php 给对象动态增加属性 及子类继承父类的构造方法

    <?php error_reporting(-1); ini_set('display_errors','on'); class A { public $a = 'hello'; public  ...

  8. Android下打印堆栈的两种方法

    1. for(StackTraceElement i:Thread.currentThread().getStackTrace()){ System.out.println(i); } 2. Log. ...

  9. 几个css问题

    1.中文.英文和数字的表现方式不一样. 中文可以自动换行,英文和数字并不会自动换行,设置强制换行显示.word-wrap:break-word; 2.textarea中输入文字多的情况下,和邻边的in ...

  10. 触电(by quqi99)

    高压电线杆相关的触电方式主要是两种: 一是跨步电压,高压电线落在地面时,如果人恰好在这个范围内步行时,就会从一只脚到跨下再到另一只脚到地形成回路,这叫跨步电压.步子越大,电压越大(以落地点为圆心向外电 ...