Vue 項目 父組件向子組件傳遞數據,子組件採用el-form 對數據進行綁定,因爲數據綁定是雙向的,對數據 進行更改後,造成了其他依賴數據的組件顯示不正確的情況,所以考慮對數據進行深拷貝,方法如下
function judgeType (obj) {
// tostring會返回對應不同的標籤的構造函數
const toString = Object.prototype.toString
const map = {
'[object Boolean]': 'boolean',
'[object Number]': 'number',
'[object String]': 'string',
'[object Function]': 'function',
'[object Array]': 'array',
'[object Date]': 'date',
'[object RegExp]': 'regExp',
'[object Undefined]': 'undefined',
'[object Null]': 'null',
'[object Object]': 'object'
}
if (obj instanceof Element) {
return 'element'
}
return map[toString.call(obj)]
}
export const deepClone = (data) => {
const type = judgeType(data)
let obj
if (type === 'array') {
obj = []
} else if (type === 'object') {
obj = {}
} else {
// 不再具有下一層次
return data
}
if (type === 'array') {
for (let i = 0, len = data.length; i < len; i++) {
obj.push(deepClone(data[i]))
}
} else if (type === 'object') {
// 對原型上的方法也拷貝了....
for (const key in data) {
obj[key] = deepClone(data[key])
}
}
return obj
}