零基础学习Vue: 第22课 Vue子组件触发父主件方法并传递参数：子组件$emit发射事件
实现代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>$emit发射事件</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
<son @xxx="change"></son>
</div>
<template id="son">
<div @click="fn">我是子组件</div>
</template>
<script>
let son = {
template:'#son',
data(){
return {
msg:'我是子组件的数据'
}
},
methods:{
fn(){
this.$emit('xxx',this.msg)
}
}
}
let vm = new Vue({
el:'#app',
components:{
son
},
methods:{
change(value){
console.log("子组件传过来的数据msg:"+value)
console.log('子组件发射的xxx事件 我检测到了')
}
}
})
</script>
</body>
</html>
运行结果如下：
