vm.$emit(eventName,[...args])
触发当前实例上的事件。附加参数都会传给监听器回调。
只配合一个事件名使用:
定义了一个组件g-button,并且监听click事件发生时触发aFunction
<g-button @click="aFunction"></g-button>
组件模板:
<button @click="$emit('click')"></button>
配合额外参数使用:
Vue.component('magic-eight-ball', {
data: function () {
return {
possibleAdvice: ['Yes', 'No', 'Maybe']
}
},
methods: {
giveAdvice: function () {
var randomAdviceIndex = Math.floor(Math.random() * this.possibleAdvice.length)
this.$emit('give-advice', this.possibleAdvice[randomAdviceIndex])
}
},
template: `
<button v-on:click="giveAdvice">
Click me for advice
</button>
`
})
使用时:
<div id="emit-example-argument">
<magic-eight-ball v-on:give-advice="showAdvice"></magic-eight-ball>
</div>
new Vue({
el: '#emit-example-argument',
methods: {
showAdvice: function (advice) {
alert(advice)
}
}
})