父组件传子组件:

父组件:

<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这个值,一定不能一样,不然会数据会变得乱,具体杂乱可以试试看!

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