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对象的添加与删除的更多相关文章
- Vue.set 向响应式对象中添加响应式属性,及设置数组元素触发视图更新
一.为什么需要使用Vue.set? vue中不能检测到数组和对象的两种变化: 1.数组长度的变化 vm.arr.length = 4 2.数组通过索引值修改内容 vm.arr[1] = ‘aa’ Vu ...
- Vue中组件化编码 完成任务的添加、删除、统计、勾选需求(实战练习三完结)
上一个章节实现数据在组件之间的传递 .这一章主要是完成添加任务到任务栏.删除任务栏.统计任务完成情况.主要还是参数在各个组件之间的传递. 上一章节的链接地址:https://blog.csdn.net ...
- 白鹭引擎 - 对象的添加与删除 ( 开关效果 addChild, removeChild )
class Main extends egret.DisplayObjectContainer { /** * Main 类构造器, 初始化的时候自动执行, ( 子类的构造函数必须调用父类的构造函数 ...
- vue根据数组对象中某个唯一标识去重
由于在vue中,会自动在数组和对象中加入_obser__观察者模式的一些属性,所以直接用数组的filter去重(下面这种),indexOf不能准确识别 var arr = [1, 2, 2, 3, 4 ...
- for 循环 和 Array 数组对象
博客地址:https://ainyi.com/12 for 循环 和 Array 数组对象方法 for for-in for-of forEach效率比较 - 四种循环,遍历长度为 1000000 的 ...
- JavaScript中的内置对象-8--1.Array(数组)-Array构造函数; 数组的栈方法; 数组的转换方法; 数组的操作方法; 删除-插入-替换数组项; ECMAScript为数组实例添加的两个位置方法;
JavaScript内置对象-1Array(数组) 学习目标 1.掌握任何创建数组 2.掌握数值元素的读和写 3.掌握数组的length属性 如何创建数组 创建数组的基本方式有两种: 1.使用Arra ...
- 将Json对象数组转化成JS Array数组
private format(cards:any):Array<any>{ var result = new Array(); cards.forEach(element => { ...
- JavaScript高级编程——Array数组迭代(every()、filter()、foreach()、map()、some(),归并(reduce() 和reduceRight() ))
JavaScript高级编程——Array数组迭代(every().filter().foreach().map().some(),归并(reduce() 和reduceRight() )) < ...
- es6中对象转数组,转map
//对象转数组let array = Object.keys(userPermission).map(key=> userPermission[key]) console.log(array) ...
随机推荐
- system libzip must be upgraded to version >= 0.11
PHP当前最新版本是PHP7.3,今天在尝试安装的过程中报如下错误: system libzip must be upgraded to version >= 0.11, 根据提示我们可以清楚的 ...
- phtoshop cs6 下载安装及破解方法(另附Photoshop CC 2018破解版图文教程)
前言: 前端虽然用PS不多,但有时需要用PS切图:UI给你PSD图,需要取色,查看字体颜色大小:测量元素宽高等 但有时想找一个“麻雀虽小,五脏俱全”又是破解版的PS,也不是那么容易的 注:ps完整版不 ...
- SpringBoot+logback实现日志打印
logback介绍 logback是一款开源的日志框架,内核重写了,是基于log4j基础进行改良的.其官网为logback.qos.ch.logback在性能上有很大提升,拥有更多特性. logbac ...
- springmvc的Controller里实现转发的同时弹出提示对话框
以前写servlet时就用到这个,但是现在学了springMVC+hibernate后就不知道怎么实现了,后来在网上找了好多,看了好多,最后经过自己实践成功的如下: 1.首先是Controller控制 ...
- Ubuntu释放磁盘空间的几种常用方法
一 安装stacer,使用它来清空系统内存 其实 Stacer 的安装步非常简单,只需到 Github 的发布页面下载到 .deb 包,再用 GDebi 或如下命令安装即可: wget https:/ ...
- Ubuntu下安装和使用开源的tts软件Flite
Flite是什么? Flite是一个小型.快速的TTS系统,是festival的C版本,可用于嵌入式系统,支持WinCE.Palm OS 等. 下载方法: wget http://www.festvo ...
- kindeditor扩展粘贴截图功能&修改图片上传路径并通过webapi上传图片到图片服务器
前言 kindeditor是一个非常好用的富文本编辑器,它的简单使用我就不再介绍了. 而kindeditor却对图片的处理不够理想. 本篇博文需要解决的问题有两个: kindeditor扩展粘贴图片功 ...
- 【jQuery】(4)---jQuery常用事件
[jQuery入门](4)---jQuery常用事件 一.常用事件列表 1.blur() 当失去焦点时触发.包括鼠标点击离开和TAB键离开. 2.change() 当元素获取焦点后,值改变失去焦点事触 ...
- Maven内置属性、POM属性
1.内置属性(Maven预定义,用户可以直接使用) ${basedir}表示项目根目录,即包含pom.xml文件的目录; ${version}表示项目版本; ${project.basedir}同${ ...
- 【干货】利用MVC5+EF6搭建博客系统(二)测试添加数据、集成Autofac依赖注入
PS:如果图片模糊,鼠标右击复制图片网址,然后在浏览器中打开即可. 一.测试仓储层.业务层是否能实现对数据库表的操作 1.在52MVCBlog.IRepository程序集下创建IsysUserInf ...