vue基础——数据共享

组件间的数据共享方式较为常用的有父子关系，以及兄弟关系

①父组件向子组件传输数据：需要属于自定义属性

首先在子组件中通过props定义一个自定义的属性，然后在父组件中引用，如下面代码：

//父组件
<Son :msg="message" :user="userinfo"></Son>

data(){
    return {
        message: 'hello vue.js',
        userinfo:{ name:'zs',age:20}
    }
}

//子组件
<template>
    <div>
        <h5>Son 组件</h5>
        <p>父组件传递过来的msg值是：{
  { msg }}</P>    
        <p>父组件传递过来的user的值是：{
  { user}}</p>
    </div>

</template>

props:['msg','user']

②子组件向父组件共享数据使用自定义事件，示例代码如下：

//子组件
export default{
    data(){
        return {count:0}    
      },
    methods:{
        add(){
            this.count +=1
            //修改数据时，通