ES6 常用数据处理及Vue+element应用场景

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=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

你可能感兴趣的:(vue.js,es6,element-ui,javascript,前端)