Vue事件派发后接收不到，求指点？

Question

如下代码，我从子组件派发一个事件，但是在父组件中并没有接受到，这是为什么，代码如下：说明：代码可以直接在浏览器下运行查看效果，结果会在控制台打印。<script type="text/javascript" src="https://cdn.bootcss.com/vue/2.5.13/vue.min.js"></script><div id="app">    <child v-on:test='getEmit'></child></div><script type="text/javascript">var Template={    'child':{        template:'<button v-on:click="func()"  ref="butt">{{name}}</button>',        data:function(){            return {                'name':'nihao'            }        },        methods:{            func:function(){                console.log("输出button内容"+this.$refs.butt.textContent);                vm.$emit('test', this.$refs.butt.textContent)            }        }    }};var vm=new Vue({    el:'#app',    data:{},    methods:{        getEmit:function(){            // 这里没有输出，为什么            console.log("div触发");        }    },    components:Template});// vm.$on('test',function(e){//     console.log('on触发输出内容'+e);// });</script>

Answer 1

将func里面的的vm改为this就好了哦，因为emit是子组件提交事件的呢，可以看看官网api进而了解一下

Answer 2

template:'<button v-on:click="func()" ref="butt">{{name}}</button>',

改成

template:'<button v-on:click="func" ref="butt">{{name}}</button>',