vue props傳值常見問題

傳入的值想做爲局部變量來使用,直接使用會 報錯。錯誤是說的避免直接修改父組件傳入的值,由於會改變父組件的值javascript

解決方案:java

能夠在data中從新定義一個變量,改變指向,可是也只是針對簡單數據類型,由於複雜數據類型棧存貯的是指針,數組

props:['listShop'],
    data(){
      return{
        listShopChild:this.listShop
      }
    },
    created(){
      this.listShopChild=30
    }

對複雜數據類型,
1. 能夠手動深度克隆一個複雜的數據出來,循環或者遞歸都行this

//數組
var x = [1,2,3];
var y = [];
for (var i = 0; i < x.length; i++) {
    y[i]=x[i];
}
console.log(y);  //[1,2,3]
y.push(4);
console.log(y);  //[1,2,3,4]
console.log(x);  //[1,2,3]

//對象
var x = {a:1,b:2};
var y = {};
for(var i in x){
    y[i] = x[i];
}
console.log(y);  //Object {a: 1, b: 2}
y.c = 3;
console.log(y);  //Object {a: 1, b: 2, c: 3}
console.log(x);  //Object {a: 1, b: 2}

2. Object.assign   (看狀況使用)
只會對只是一級屬性複製,比淺拷貝多深拷貝了一層而已,因此仍是沒法達到深度克隆的目的.spa

3. 強大的JSON.stringify和JSON.parse指針

const obj1 = JSON.parse(JSON.stringify(obj))
相關文章
相關標籤/搜索