vue props注意

等到看你银色满际，等到分不清季节更替，才敢说沉溺。——《水星记》

官方文档：https://cn.vuejs.org/v2/guide/components-props.html

我们在使用vue的prop时

如果prop其数据类型为一个对象

则传入的是一个对象的地址引用

我们如果在子组件中使用watch将其赋值给一个data，用于外部组件状态发生变化时，内部的某一data也能同时响应：

  watch: {
    productionData: {
      immediate: true,
      handler() {
        this.myData = this.myProp
      },
    }
}

这时候如果我们对myData里的属性进行更改，发现外部(父组件)传过来的对象数据源也发生了变更

如果我们想要深拷贝

则可以使用：

function deepClone( obj ){
  let clone = obj;
  if (obj && typeof obj === "object") {
    clone = new obj.constructor();

    Object.getOwnPropertyNames(obj).forEach(
      prop => (clone[prop] = deepClone(obj[prop]))
    );
  }
  return clone;
};

运行：

let ids = [1,2,3]
let obj = deepClone({ruben:{ids}})
ids.pop()
console.log(obj)		// {"ruben":{"ids":[1,2,3]}}
console.log(ids)		// [1, 2]