mitt插件地址:
https://github.com/developit/mitt
使用mitt之前先安装mitt模块
1 | npm install --save mitt |
1、新建model/event.js
1 | import mitt from 'mitt' |
2 | const VueEvent = mitt(); |
3 | export default VueEvent; |
01 | <template> |
02 | <button @click= "doLogin" >非父子组件传值</button> |
03 | </template> |
04 |
05 | <script> |
06 | import VueEvent from '../model/event' |
07 | export default { |
08 | data() { |
09 | return { |
10 | msg: '' |
11 | } |
12 | }, |
13 | methods: { |
14 | doLogin() { |
15 | VueEvent.emit( "login" , this .msg); |
16 | } |
17 | } |
18 | } |
19 | </script> |
01 | <template> |
02 | 我是用户登录组件 |
03 | </template> |
04 | <script> |
05 | import VueEvent from '../model/event' |
06 | export default { |
07 | mounted() { |
08 | VueEvent.on( "login" , (data) => { |
09 | alert(data) |
10 | }) |
11 | } |
12 | } |
13 | </script> |