<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--父亲拿儿子的属性,通过的就是发布订阅,父亲声明一个方法,儿子触发-->
<div id="app"></div>
</body>
<script src="node_modules/vue/dist/vue.js"></script>
<script>
//实例化一个Vue函数
let vm=new Vue({
//child 是儿子 触发了自己的一个方法,绑定了父亲的一个函数方法
template:'<div><child @childs="say"></child></div>',
//方法挂载
methods:{
//父亲的一个方法
say(data){
console.log(data);
}
},
//定义一个儿子组件
components:{
//儿子名字
child:{
//事件和数据初始化之后
created(){
//儿子发射一个方法 传递自己的数据
this.$emit('childs',this.msg);
},
template:'<div>子</div>',
data(){
return {
msg:"我饿了"
}
},
}
},
}).$mount("#app"); //手动将vue挂载在#app标签上
</script>
</html>