关于vue.js:ES6-常用数据处理及Vueelement应用场景

48次阅读

共计 1437 个字符,预计需要花费 4 分钟才能阅读完成。

1. 获取雷同 ID 下的对象的值
利用场景;vue+element select 回显在 table 中解决 || 后盾传 label 值回显的时候

export function mapOptionLabel(data, value) {let item = data.find(item => item.value === value);
  if (item) {return item.label;}
  return "-";
}

2. 过滤掉两个数组中对象 id 值相等的项
办法 1

let arr1=[{id:1,name:'老大'},{id:2,name:'老二'}]
let arr2=[{id:1,name:'老大'},{id:3,name:'老三'},{id:4,name:'老四'},{id:5,name:'老五'}]
let add=arr2.filter(item=>!arr1.some(ele=>ele.id===item.id))

办法 2

const arr1 = [{id: 1, name: '老大'}, {id: 2, name: '老二'}];

const arr2 = [{id: 1, name: '老大'}, {id: 3, name: '老三'}];

// 获取到 arr1 的所有 id 汇合

let arr1Ids = arr1.map(item => item.id);

// 过滤 arr2 中不蕴含 arr1 雷同的 id 数组。const result = arr2.filter(item => !arr1Ids.includes(item.id));

console.log(result);

3.element table 表格回显数据

let ids = this.statementIds.split(',') // a

let tableId = [] // b

this.tableData.forEach(res=>{ // 把表格里所有的 id 退出到 b 里

tableId.push(res.billId.toString())

})

for(let i = 0;i<tableId.length;i++){ // 对 b 循环 如果 b 外面有 a(a 是被选中的行)则把索引代入到 first 函数里 让这些行的复选框选中

if(tableId.indexOf(ids[i])>=0){this.first([this.tableData[tableId.indexOf(ids[i])]])

}

}

4. 校验含有某个字符串

['create', 'edit'].includes(pageAction)
5. 过滤两个数组中雷同项,生成一个新数组
办法 1

let a = [a, b, c, d, e];
let b = [c, d, f, g, h];
    
let result = b.filter(item => !a.some(e => e === item));
//result: [f, g, h]

办法 2

a.filter(item=>b.indexOf(item)==-1)

6.element,tree 构造回显未抉择的数据
我司后盾给了两个数组对象,tree 构造一个 b;选中的数据为 a
须要比照 b 中 id 和 a 中 id 相等的时候过滤掉

a = [{id:1}]
b = [{id:1,name : 'name'}]
`result = b.filter(item => !a.some(ele=>ele.id===item.id));`

7.ES6 数组排重在从新排序

var arr=[1,3,3,5,9,4,6,7];
let s=new Set(arr1);
let arr = [....s];

consolo.log(arr);

// 打印进去的是 1,3,4,5,6,7,9

正文完
 0