<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>xieting</title>
</head>
<body>
<!--父亲绑定事件,儿子触发这个事件 单项数据流-->
<div id='app'>
父亲:{{money}}
<child :m="money" @child-msg="things"></child>
</div>
</body>
</html>
<script src="node/node_modules/vue/dist/vue.js"></script>
<script>
let vm = new Vue({
el: '#app',
data: {money:400},
methods:{
things(val){
this.money=val;
alert(val);
}
},
components:{
child:{
props:['m'],
template:'<div>儿子:{{m}}<button @click="getMoney()">钱</button></div>',
methods:{
getMoney(){
this.$emit('child-msg',800)//触发自己的自定义事件,让父亲的方法执行
}
}
}
},
})
</script>