创建一个eventVue.js文件
import Vue from 'vue' export default new Vue
父
<template> <div> <div>父</div> <v-youngerChild></v-youngerChild> <v-bigChild></v-bigChild> </div> </template> <script> import YoungerChild from './Child' import BigChild from './BigChild' export default { components:{ 'v-youngerChild':YoungerChild, 'v-bigChild':BigChild } } </script>
哥哥
<template> <div> <div>哥哥</div> {{message}} </div> </template> <script> import eventVue from '../assets/js/eventVue.js' export default { data(){ return{ message:'哥哥' } }, created(){ eventVue.$on("myFun",(message)=>{ this.message=message }) } } </script>
弟弟
<template> <div> <div>弟弟</div> <button @click="abtn">点击</button> </div> </template> <script> import eventVue from '../assets/js/eventVue.js' export default { data(){ return{ msg:'弟弟' } }, methods:{ abtn(){ eventVue.$emit("myFun",this.msg) } } } </script>