vue-cli2一些处理数据的小方法

135 阅读1分钟

1、在页面打出空格

{{"\xa0\xa0"}}

2、对象之间的深拷贝

**浅拷贝只复制指向某个对象的指针,而不复制对象本身,新旧对象还是共享同一块内存。修改新对象的同时也会改变旧对象的值
****但深拷贝会另外创造一个一模一样的对象,新对象跟原对象不共享内存,修改新对象不会改到原对象。
**深拷贝方法:

//arr拷贝给brr 
let data = JSON.stringify(arr) 
brr = JSON.parse(data)

3、对象数组按照不同属性进行分组

原始数组:

arr = [
  {
    "projectId": 99,
    "tableName": "7.2补丁安全",
    "tableType": "物理安全",
    "hostUuid": "",
  },
  {
    "projectId": 99,
    "tableName": "7.1数据备份",
    "tableType": "物理安全",
    "hostUuid": "",
  }
]

执行代码:

groupAnnex(arr){
  let map = {}
  for (let i = 0; i < arr.length; i++) {
    let ai = arr[i]
    if (!map[ai.tableName]) {
      map[ai.tableName] = [ai]
    } else {
      map[ai.tableName].push(ai)
    }
  }
  let ress = []
  Object.keys(map).forEach(key => {
    ress.push({
      title: key,
      data: map[key],
    })
  })
  return ress
},

返回结果:

[  {    "title": "7.2补丁安全",    "data": [      {        "projectId": 99,        "tableName": "7.2补丁安全",        "tableType": "物理安全",        "hostUuid": "",      }    ]
  },
  {
    "title": "7.1数据备份",
    "data": [
      {
        "projectId": 99,
        "tableName": "7.1数据备份",
        "tableType": "物理安全",
        "hostUuid": "",
      }
    ]
  }
]

4、数据json化

data = JSON.stringify(data)

5、$ruter快速返回上一页

this.$router.go(-1)

6、为对象添加属性并更新到视图层

this.$set(对象, 属性名【字符串类型】, 属性值)

例:
  this.$set(this.objectName, 'key', valuee)