1、树形数据转换
在处理商品分类数据、企业列表数据等情况下,后台会返回到前台所有的数据。我们需要根据parentId,数据ID将数据转换为树形数据进行渲染。
/*** 树形数据转换* @param {*} data* @param {*} id* @param {*} pid*/
export function treeDataTranslate(data, id = 'id', pid = 'parentId') {var res = []var temp = {}for (var i = 0; i < data.length; i++) {temp[data[i][id]] = data[i]}for (var k = 0; k < data.length; k++) {if (temp[data[k][pid]] && data[k][id] !== data[k][pid]) {if (!temp[data[k][pid]]['children']) {temp[data[k][pid]]['children'] = []}if (!temp[data[k][pid]]['_level']) {temp[data[k][pid]]['_level'] = 1}data[k]['_level'] = temp[data[k][pid]]._level + 1temp[data[k][pid]]['children'].push(data[k])} else {res.push(data[k])}}return res
}
2、获取当前年月日
/*** 获取当前年与日* 格式为 YYYY-MM-DD*/
export function getNowFormatDate() {let date = new Date();let seperator1 = "-";let year = date.getFullYear();let month = date.getMonth() + 1;let strDate = date.getDate();if (month >= 1 && month <= 9) {month = "0" + month;}if (strDate >= 0 && strDate <= 9) {strDate = "0" + strDate;}let currentdate = year + seperator1 + month + seperator1 + strDate;return currentdate;
}
3、对象的深拷贝
在vue项目中,常常会碰到编辑数据的问题。当用户点击了编辑,进行数据编辑。然而并没有进行保存,这样就会导致页面数据保留更改(双向数据绑定)造成很不好的体验。这时就需要对对象进行深拷贝来避免这个问题。
export function deepClone(source) {if (!source && typeof source !== 'object') {throw new Error('error arguments', 'shallowClone')}const targetObj = source.constructor === Array ? [] : {}for (const keys in source) {if (source.hasOwnProperty(keys)) {if (source[keys] && typeof source[keys] === 'object') {targetObj[keys] = source[keys].constructor === Array ? [] : {}targetObj[keys] = deepClone(source[keys])} else {targetObj[keys] = source[keys]}}}return targetObj
}