组件之间传值

关于组件之间的传值

当业务需求，代码实现需要各个组件传值

父传子

代码片.

// An highlighted block
<loading-page :info="info" :classdata="classdata"></loaging-page>
// 将data中的数据传值过去

props["info",'classdata']

子传父

代码片

// 子组件给父组件传值 通过事件传值
<button @click="info">按钮</button>
methods:{
info(){
 this.$emit('info', '值')
}
}

// 父组件通过事件接受传过来的值
<info @info="demo"></info>
methods:{
demo(e){
 console.log(e,'传递过来的值')
}
}

兄弟之间传值

代码片
// 新建一个js文件

import Vue from 'vue'
export default new Vue()

// 兄弟一

import bus from '../../bus.js'
methods:{
demo(){
bus.$emit('bus','值')
}
}

// 兄弟二

import bus from '../../bus.js'
created(){
bus.$on('bus',(e)=>{
console.log(e, '传递过来的值')
})
}