来自主vue实例的事件自定义事件，从组件中侦听

Question

这里是vue js的新手，

只是想知道是否可以从主vue实例（父级）发出自定义事件，组件可以侦听该自定义事件并在触发该事件时采取相应的行动？

我想在vue实例已安装生命周期功能上触发自定义事件，然后所有组件都可以自行初始化。

离。

主要vue实例

new Vue( {
    el : '#main-app',
    mounted : function() {
       this.$emit( 'init-app' );
    }
} );

然后在各种组件上，它可以监听＆＃39; init-app＆＃39; 自定义事件，然后在触发或发出时相应地执行操作。

不确定如何在vue js中执行此操作事件侦听器附加到html标记？可以通过仅从父单元发出事件来触发事件监听器或组件中的功能吗？

注意：我使用的是vue js 2.0.3 我的组件是全局的，它们不是内联的

离。

Vue.component('my-component', {
   template: '#component-template'
});

我稍后可以添加更多组件。

提前致谢。

Answer 1

初始化子组件的正确方法是为每个子组件使用created:生命周期钩子。

原因：当您从父组件发送init-app事件时，很可能无法实例化您的子组件。所以，它永远不会被初始化。

关于事件的附加说明：如果要从子组件向父组件发送事件，则应使用this.$parent.$emit("my-event-code")并在父端接收this.$on("my-event-code")。经过几个小时尝试各种方法后，我最近发现了它。

因此，如果您尝试从父级发送init-app事件，您可能必须将子组件监听为this.$parent.$on("init-app", ...) - 我还没有验证这一点，这是我目前的理解。