vue.js - 关于vue中$emit事件问题

问题描述

问 题

在vue+webpack的组件模块结构下 , 我在App.vue这里用this.$on监听相关事件，然后在test组件里调用this.$emit后一直没什么反应

但是我直接写在一起就可以响应

难道是应为this的不同还是？？？

解决方案

on和emit的事件必须是在一个公共的实例上，才能触发。

我的解决方案是：

1. 新建bus.js

   import Vue from 'vue'
   
   export var bus = new Vue()

2. App.vue里created方法里定义事件

   import { bus } from 'bus.js'
   // ...
   created () {
     bus.$on('tip', (text) => {
       alert(text)
     })
   }

3. Test.vue组件内调用

   import { bus } from 'bus.js'
    // ...
   bus.$emit('tip', '123')

这篇关于vue.js - 关于vue中$emit事件问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！