vue.js 自定义事件

<div id="app"> ???<h2>{{num}}</h2> ?????<h1>全局组件</h1> ???<my-component @myclick="vueAdd"></my-component> ?<!-- 渲染全局组件--></div></body></html><script>
/* 

*/
 ???Vue.component(‘my-component‘,{ ????// 全局组件语法 ???????template:`<div> ???????????????//模板字符串 ????????????????????<h2>{{n}}</h2> ????????????????????<button @click="add">+1</button> ?????????????????</div>`, ???????data(){ ???????????????????????//data是个函数，初始化全局组件的变量n ???????????return { ???????????????n:0 ??????????????} ???????}, ???????methods:{ ??????????????????????add(){ ?????????????????????//这里定义的方法只用在全局组件中的template中 ???????????????this.n += 1; ???????????????this.$emit(‘myclick‘); ??//$emit自定义事件 $emit(事件名字) 不要使用驼峰 ???????????} ???????} ???});//实例化 ???new Vue({ ???????el:‘#app‘, ???????data:{ ???????????num:0 ???//初始化 num ????// 实例化中的data是个josn形式的对象，初始化#app容器中的变量 ???????}, ???????methods:{ ??????????????????// 实例化中的methods方法也用在 #app 容器里使用 ???????????vueAdd(){ ????????????????this.num += 1; ?????????????} ???????} ???})</script>