element vue Array数组和Map对象的添加与删除操作

使用场景:

一个后台系统中, 管理员要配置自定义字段后台要生成id和title,其他角色要使用自定义字段的表单, 添加数据, 但是每个要填写的对象的id 和title都是无法固定的,因此页面显示的title 和id都需要自定义数字和map对象来实现,vue 的数值动态添加内容需要特定的方式:

1.定义一个vue空数组与一个vue 空Map对象:

data: function() {
  return{
    arrayData:[],//自定义字段中下拉框的数组
    mapData:{},//自定义字段提交保存数据的map
    dbData:[
      {}
    ],//数据库查询出来的自定义字段

    mapKey:'age',
    mapValue:29,
    arrayIndex:0,
    arrayValue:'中国',
  };
}

2.赋值对象:

Map 赋值: Vue.set(this.mapData,this.mapkey,this.mapValue);
Array 赋值: Vue.set(this.arrayData,this.arrayIndex,this.arrayValue);

总结

以上所述是小编给大家介绍的element vue Array数组和Map对象的添加与删除,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

时间: 2018-11-12

JavaScript中循环遍历Array与Map的方法小结

js循环数组各种方法 eg1: for (var i = 0; i < myStringArray.length; i++) { alert(myStringArray[i]); //Do something } eg2: Array.prototype.foo = "foo!"; var array = ['a', 'b', 'c']; for (var i in array) { alert(array[i]); } for(var i in this.$GLOBAL_DET

JavaScript中利用Array和Object实现Map的方法

本文实例讲述了JavaScript中利用Array和Object实现Map的方法.分享给大家供大家参考.具体如下: 昨天突然看到以前别人用JavaScript实现的Map感觉很不错,但是发现有个别方法有问题,顺便完善了下,添加了 remove .indexOf .values.clear等方法. /** * @author blune68 * @version 0.1, 07/27/12 * */ function Map(){ this.keys = new Array(); this.dat

浅析php中array_map和array_walk的使用对比

一.array_map() 1.array_map() 函数将用户自定义函数作用到数组中的每个值上,并返回用户自定义函数作用后的带有新值的数组,若函数作用后无返回值,则对应的新值数组中为空. 2.回调函数接受的参数数目应该和传递给 array_map() 函数的数组数目一致. 3.提示:您可以向函数输入一个或者多个数组. 若相函数输入2个数组,其函数接受参数也应该有两个,map给函数传值时,是每次从两个数组中分别取一个传给函 数.即多个数组之间是同步提交的,不是提交完一个数组再提交下一个提交几个

5个数组Array方法: indexOf、filter、forEach、map、reduce使用实例

ECMAScript5标准发布于2009年12月3日,它带来了一些新的,改善现有的Array数组操作的方法.然而,这些新奇的数组方法并没有真正流行起来的,因为当时市场上缺乏支持ES5的浏览器. Array "Extras" 没有人怀疑这些方法的实用性,但写polyfill(PS:兼容旧版浏览器的插件)对他们来说是不值得的.它把"必须实现"变成了"最好实现".有人居然将这些数组方法称之为Array "Extras".哎! 但是,

Go语言中的Array、Slice、Map和Set使用详解

Array(数组) 内部机制 在 Go 语言中数组是固定长度的数据类型,它包含相同类型的连续的元素,这些元素可以是内建类型,像数字和字符串,也可以是结构类型,元素可以通过唯一的索引值访问,从 0 开始. 数组是很有价值的数据结构,因为它的内存分配是连续的,内存连续意味着可是让它在 CPU 缓存中待更久,所以迭代数组和移动元素都会非常迅速. 数组声明和初始化 通过指定数据类型和元素个数(数组长度)来声明数组. 复制代码 代码如下: // 声明一个长度为5的整数数组 var array [5]int

理解Golang中的数组(array)、切片(slice)和map

我比较喜欢先给出代码,然后得出结论 数组 复制代码 代码如下: package main import (     "fmt" ) func main() {     arr := [...]int{1, 2, 3}     //打印初始的指针     fmt.Printf("the pointer is : %p \n", &arr)     printPointer(arr) } func printPointer(any interface{}) {

php array_map使用自定义的函数处理数组中的每个值

array_map 将回调函数作用到给定数组的单元上. 说明 array array_map ( callable $callback , array $arr1 [, array $... ] ) array_map() 函数将用户自定义函数作用到数组中的每个值上,并返回用户自定义函数作用后的带有新值的数组. 回调函数接受的参数数目应该和传递给 array_map() 函数的数组数目一致. 参数介绍: 参数 描述 callback 必需.对每个数组的每个元素作用的回调函数. arr1 必需.将

详谈js遍历集合(Array,Map,Set)

Array可以使用下标,Map和Set不能使用下标,ES6引入了iterable类型,Array,Map,Set都属于iterable类型,它们可以使用for...of循环来遍历: var a = ['A', 'B', 'C']; var s = new Set(['A', 'B', 'C']); var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]); for (var x of a) { // 遍历Array alert(x); } for (var

详谈js中数组(array)和对象(object)的区别

•object 类型: ◦ 创建方式: /*new 操作符后面Object构造函数*/ var person = new Object(); person.name = "lpove"; person.age = 21; /*或者用对象字面量的方法*/ var person = { name: "lpove"; age : 21; } •array类型 ◦ 创建方式: `var colors = new Array("red","blu

js遍历map javaScript遍历map的简单实现

js遍历map javaScript遍历map的简单实现 var map = { "name" : "华仔", "realname":"刘德华" }; for (var key in map) { console.log("map["+key+"]"+map[key]); } 这样会把map给遍历掉,显示在浏览器上的控制器里. 以上这篇js遍历map javaScript遍历map的简单

Js遍历键值对形式对象或Map形式的方法

最近在项目中使用ajax返回的是一个map对象,怎么遍历这个map对象?去网上查了好多,真正有用很少,终于让我想起自己以前一个需要遍历key=Value形式的对象,想了想这种方式,应该也对于map适用吧.所以试了下,成功了!记录下来以备后用. 在JS中如何遍历key=value键值对,对象的数据(也可以是map形式). for ( var key in changes) { //通过遍历对象属性的方法,遍历键值对,获得key,然后通过 对象[key]获得对应的值 name = key; valu

js遍历详解(forEach, map, for, for...in, for...of)

forEach es5出来的方法,这是我在react中用的最多的遍历方法之一,用法如下: models.forEach(model => app.model(model)); dva里面经常这么写. 写法很简单,经常用于通过这个数组内的数据创造新的结构,但是forEach的问题在于它不能跳出循环. map 也是用的最多的方法之一,用法如下 {data.map(d => ( <div className="balance-row"> <div classNa

详谈JS中数组的迭代方法和归并方法

数组的迭代方法 ES5中为数组定义了5个迭代方法.每个方法都要接收两个参数:要在每一项上面运行的函数和(可选的)运行该函数的作用域对象---影响this的值. 传入方法中的函数会介绍三个参数:1.数组项的值 2. 该项在数组的中位值 3. 数组对象本身: every()和some()方法 every():对数组中的每一项运行给定函数,如果每一项都返回true,则返回true,否则false: some():对数组中的每一项运行给定函数,如果至少有一项返回true,则返回true,否则false:

js 自带的 map() 方法全面了解

1. 方法概述 map() 方法返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组. 2. 例子 2.1 在字符串中使用map 在一个 String  上使用 map 方法获取字符串中每个字符所对应的 ASCII 码组成的数组: var map = Array.prototype.map var a = map.call("Hello World", function(x) { return x.charCodeAt(0); }) // a的值为[72, 101, 10

详谈js中标准for循环与foreach(for in)的区别

js中遍历数组的有两种方式 var array=['a'] //标准的for循环 for(var i=1;i<array.length;i++){ alert(array[i]) } //foreach循环 for(var i in array){ alert(array[i]) } 正常情况下上面两种遍历数组的方式结果一样.首先说两者的第一个区别 标准的for循环中的i是number类型,表示的是数组的下标,但是foreach循环中的i表示的是数组的key是string类型,因为js中一切皆为

JS实现集合的交集、补集、差集、去重运算示例【ES5与ES6写法】

本文实例讲述了JS实现集合的交集.补集.差集.去重运算.分享给大家供大家参考,具体如下: ES5写法: ///集合取交集 Array.intersect = function () { var result = new Array(); var obj = {}; for (var i = 0; i < arguments.length; i++) { for (var j = 0; j < arguments[i].length; j++) { var str = arguments[i][

你应该了解的JavaScript Array.map()五种用途小结

前言 从经典的 for 循环到 forEach() 方法,用于迭代数据集合的各种技术和方法比比皆是.但是现在比较流行的方法是 .map() 方法. .map() 通过指定函数调用一个数组中每一项元素,来创建一个新数组. .map() 是一种 non-mutating(非变异) 方法,它创建一个新数组,而不是只对调用数组进行更改的 mutating(变异) 方法.这可能很难记住. 语法: array.map(function(currentValue,index,arr), thisValue)