The above code will not have any output when clicking on the Child of the page, because it is bound to a custom event. To have output, you need to do this:
<body>
<div id="app">
<child @click="handleClick"></child>
</div>
<script>
Vue.component('child', {
template: '<div @click="componentClick">Child</div>',
methods: {
componentClick() {
this.$emit('click', '子组件通过自定义事件传递的值')
}
}
})
var vm = new Vue({
el: '#app',
data: {
},
methods: {
handleClick(val) {
console.log(val)
}
}
});
</script>
</body>
But this is too much trouble, there can be a simpler way:事件修饰符native