[英]Vue.js $emit event from parent and receive it on a component (child)
[英]Vue.js - Emit event from child to parent
我无法将$emit
从子组件发送到它的父组件。 我可以成功发送事件,但不能在父级中接收它。
Results.vue
(孩子):
<a href="#" v-on:click="sendResultValues"></a>
//
methods: {
sendResultValues: function () {
this.$emit('send-result-values', 'carrier');
}
},
当我点击<a>
时,我可以使用 Vue DevTools 看到一个$emit
事件被触发:
但是,console.log 中没有收到任何内容,因为我的代码如下(父级):
Input.vue
(父级 ):
<search-results></search-results> //Results.vue component
<search-popover v-on:send-result-values="showResultData"></search-popover>
//
methods: {
showResultData: function () {
console.log("Data received from child: ")
}
},
您需要在search-results
组件上监听事件,而不是在search-popover
上监听事件。
Input.vue(父级):
<search-results v-on:send-result-values="showResultData"></search-results>
<search-popover></search-popover>
methods: {
showResultData: function () {
console.log("Data received from child: ")
}
},
有更多方法可以解决此问题。
例如
vm.$emit('test', 'hi');
vm.$on('test', function (msg) { console.log(msg) }); // => "hi"
在我看来,你应该在父端做事件声明方程。
你错了: <a href="#" v-on:click="sendResultValues"></a>
点击事件不应该是那个,它应该是发送结果值。 所以结果是
<a href="#" v-on:send-result-values="sendResultValues"></a>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.