$emit傳入的事件名稱只能使用小寫，不能使用大寫的駝峰規(guī)則命名

如果修改后還是不行的話，就改用：

this.$parent.Event (Event為父組件中的自定義方法)

補充知識：Vue.js 使用 $emit 觸發(fā)事件填坑

vue的組件內觸發(fā)外部事件不起作用

vue的組件內觸發(fā)自定義事件（發(fā)外部事件）不起作用

今天學習vue的自定義組件功能，在組件內部觸發(fā)一個事件，在使用組件的地方使用v-on綁定這個事件，然而觸發(fā)一直不生效，檢查了很多遍的代碼都沒看出什么問題，代碼如下：

<div id='app'> <button v-on:click='IncrHandle'>增加</button> <input v-model='total' placeholder='請輸入內容' /> <child v-bind:count='total' v-on:onIncr='IncrHandle'></child></div>Vue.component('child',{ props:[’count’], template:'<button v-on:click=’incr’>增加{{count}}</button>', data: function(){ return { count: 0 } }, methods:{ incr: function(){ this.$emit(’onIncr’) this.count += 1 } }})new Vue({ el:'#app', data:{ total: 0 }, methods:{ IncrHandle:function(){ this.total += 1 total('增加1') }, DncrHandle:function(){ this.total -= 1 } }})

經過無數的驗證，終于找到了解決辦法：

保證待傳遞的事件名稱為純小寫。不可以使用駝峰j格式。

即：

將v-on:onIncr改為v-on:onincr，將this.emit(′onIncr′)改為this.emit(&#x27;onIncr&#x27;)改為this.emit( ′ onIncr ′ )

改為this.emit(‘onincr’)

以上這篇Vue $emit()不能觸發(fā)父組件方法的原因及解決就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持好吧啦網。