来自主 vue 实例的事件自定义事件,从组件监听
Event custom event from main vue instance, listen from component
这里是 vue js 的新手,
只是想知道是否可以从主 vue 实例(父实例)发出自定义事件并且组件可以侦听该自定义事件并在该事件被触发时采取相应行动?
我想在 vue 实例上触发自定义事件 mounted 生命周期函数,然后所有组件都可以自行初始化。
例如
主vue实例
new Vue( {
el : '#main-app',
mounted : function() {
this.$emit( 'init-app' );
}
} );
然后在各种组件上,它可以侦听 'init-app' 自定义事件,然后在触发或发出时采取相应的行动。
不确定该怎么做,因为在 vue js 中事件侦听器附加到 html 标签?事件侦听器或组件中的函数是否可以仅通过仅从父级发出事件来触发?
注意:我使用的是 vue js 2.0.3
我的组件是全局的,它们不是内联的
例如
Vue.component('my-component', {
template: '#component-template'
});
稍后我可以添加更多组件。
提前致谢。
初始化子组件的正确方法是对每个子组件使用 created:
生命周期挂钩。
原因:当您从父组件发送 init-app
事件时,很有可能您的子组件未被实例化。所以,它永远不会被初始化。
关于事件的附加说明:如果您要从子组件向父组件发送事件,您应该使用 this.$parent.$emit("my-event-code")
并在父端以 this.$on("my-event-code")
接收它。经过数小时尝试各种方法后,我最近弄明白了。
因此,如果您尝试将 init-app
事件从父级发送到子级,您可能必须以 this.$parent.$on("init-app", ...)
的形式监听子组件 - 我尚未验证这一点,这是我目前的理解。
这里是 vue js 的新手,
只是想知道是否可以从主 vue 实例(父实例)发出自定义事件并且组件可以侦听该自定义事件并在该事件被触发时采取相应行动?
我想在 vue 实例上触发自定义事件 mounted 生命周期函数,然后所有组件都可以自行初始化。
例如
主vue实例
new Vue( {
el : '#main-app',
mounted : function() {
this.$emit( 'init-app' );
}
} );
然后在各种组件上,它可以侦听 'init-app' 自定义事件,然后在触发或发出时采取相应的行动。
不确定该怎么做,因为在 vue js 中事件侦听器附加到 html 标签?事件侦听器或组件中的函数是否可以仅通过仅从父级发出事件来触发?
注意:我使用的是 vue js 2.0.3 我的组件是全局的,它们不是内联的
例如
Vue.component('my-component', {
template: '#component-template'
});
稍后我可以添加更多组件。
提前致谢。
初始化子组件的正确方法是对每个子组件使用 created:
生命周期挂钩。
原因:当您从父组件发送 init-app
事件时,很有可能您的子组件未被实例化。所以,它永远不会被初始化。
关于事件的附加说明:如果您要从子组件向父组件发送事件,您应该使用 this.$parent.$emit("my-event-code")
并在父端以 this.$on("my-event-code")
接收它。经过数小时尝试各种方法后,我最近弄明白了。
因此,如果您尝试将 init-app
事件从父级发送到子级,您可能必须以 this.$parent.$on("init-app", ...)
的形式监听子组件 - 我尚未验证这一点,这是我目前的理解。