【Vue学习笔记之，父子组件之间的传值（着重于父组件传对象值到子组件）】

今天学习到vue中，父子组件的传值
例子：
父组件 ————> 子组件

<parent>
    <sonComponent:sonValue="editSon" ref="sonComponent"></sonComponent>  <!--其中editSon为父组件的data中的值->
</parent>
import sonComponent from 'url'  ------->子组件的路径
export default {
    name:"parent",
    components:{sonComponent},
    data(){
         return {
        editSon:{
            name:'hxl'
            }
        }
    }
}
在子组件中获取传过来的值：
<sonZuJian>
    <el-input v-model="sonObj.name">
</sonZuJian>
export default{
    name:"son",
    props:{
        sonValue:{
        type:Object
        }
    },
   watch:{
       sonValue(val){
        this.sonObj = val;
        }
    },
 data(){
    return{
       sonObj:{},
       secondObj:{}
    }
 }
}

这样就可以在父组件中把父组件的editSon这个对象传到子组件中了

父组件获取子组件的值：
var thisVal = this.$refs.sonComponent.secondObj;

父组件也可以获取子组件的方法
this.$refs.sonComponent.queryDetail(param);------》这里还可以进行传参

 克隆vue对象的方法：JSON.parse(JSON.stringify(obj))