<!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>