子组件调用父组件方法，父组件调用子组件方法，子组件传值给父组件，父组件传值给子组件；兄弟之间传值

子组件调用父组件方法，父组件调用子组件方法，子组件传值给父组件，父组件传值给子组件

子组件调用父组件方法（可以多层级调用方法），子组件传值给父组件

//子组件代码
getToParent(){
    //getParent是父组件的方法名
	this.$emit('getParent'，['传值']);
}
//父组件代码
<b-tab title="父组件" value='0'>
      <safeCom @getParent='getParent'></safeCom>
</b-tab>

import safeCom from './safe_com'//引入子组件

components: {
    safeCom//激活使用子组件
  },

getParent(data){//需要调用的方法
     console.log('父组件');
    console.log(data)//传值
    //如果你还想调用父组件（即爷组件）的方法
     this.$emit('getUserInfo');
}
//爷组件代码
<el-tab-pane label="爷组件" name="4" lazy>
      <safe ref="safe" @getUserInfo='getUserInfo'></safe>
</el-tab-pane>

import safe from './safe/safe'

components: {
    safe
 },

getUserInfo(){
    console.log('爷组件');
}

父组件调用子组件方法，并且父组件传值给子组件

//父组件代码
使用ref
<el-tab-pane label="父组件" name="4" lazy>
     <safe ref="safe"></safe>
</el-tab-pane>

getSon(data){
    //gives的是子组件的方法,并且传值
   this.$refs.safe.gives(data[1]); 
}

//子组件代码
gives(id){
     this.value=id
     console.log(this.value);
},

组件之间传值

//在main.js的文件里面添加一个空的bus的实例
new Vue({
  el: '#app',
  router,
  axios,
  components: { App },
  template: '<App/>',
  data: {
    // 空的实例放到根组件下，所有的子组件都能调用
    Bus: new Vue()
  } 
})

//然后使用
//使用页面
this.$root.Bus.$emit('方法', '参数')

//接收的页面
this.$root.Bus.$on('方法', value => {
     value//参数
     //这里面可以写触发的函数
})