vue父子组件的传值

父组件传子组件：

父组件：

<headerVue custom="test"></headerVue>　　　　　　//custom自定义的一个属性；test准备传入子组件的值

子组件：

export default {
  props:["custom"]　　　　　　　　　　　　//需要引入传过来的值custom；那么custom就可以直接使用了{{custom}}
}

这样父传子，就完成了。

子组件传父组件：

1.父组件和子组件需要连接：connect.js（用一个js文件链接）

import Vue from "vue"
  var connect = new Vue();
export default connect;

2.父组件做好接受和需要的事件

import connect from "./components/connect.js"　　　　　　　　　　//引入链接的js的文件
export default {
    methods:{
        accept(){　　　　　　　　　　　　　　　　　　　　　　　　　　　　//条件满足后执行accept准备接受值！
            connect.$on("value",function(msg,b){　　　　　　　　//value一定要和后面子组件传的名称一样；参数msg，b和子组件传的值一一对应
                console.log(b);
            })
        }
    }
}

3.子组件发送值

import connect from "./connect.js"　　　　　　　　　　　　　　　　//引入链接的js，让父组件和子组件链接一起
export default {
methods:{
        sendOut(){　　　　　　　　　　　　　　　　　　　　　　　　　 //执行sendOut传值给父组件
             connect.$emit("value","test","test1")　　　　　　 //传值
        }　　　　
    }
}

这个connect.js可以复用！多个组件都可以公用，但是需要注意value这个值，一定不能一样，不然会数据会变得乱，具体杂乱可以试试看！

主要就是用来记录，下回看到自己的，让自己也能看懂！