每个Vue实例都实现了事件接口（Events interface）：使用$on(eventName)监听事件 使用$emit(eventName)触发事件
使用v-on绑定自定义事件
什么是子组件什么是父组件
<div> // 对于child来说这就是个父组件 <input v-model="parentMsg"> <br> <child v-bind:my-message="parentMsg"></child> // 这就是子组件 </div>
组件中的自定义事件
<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> <script type="text/javascript" src="js/vue.js"></script> </head> <body> <div id="app1"> <first-com v-on:inc="fuhanshu"></first-com> <!-- 三：inc事件被触发后触发父函数 --> {{totol}} </div> </body> <script type="text/javascript"> Vue.component('first-com', { template: "<button v-on:click='zihanshu'>+1</button>",//一：子组件中点击触发子组件函数 methods:{ zihanshu:function(){ this.$emit("inc"); //二：子组件函数被触发后触发inc } } }) var v1 = new Vue({ el: "#app1", data: { totol:1 }, methods:{ fuhanshu:function(){ this.totol++; //四：父函数触发后执行 } } }) </script> </html>