本文最后更新于2019年3月12日，已超过一年没有更新，如果文章内容或图片资源失效，请留言反馈，我们会及时处理，谢谢！
vue组件绑定原生事件？正常情况下我们想给一个组件绑定事件需要这样来写，首先需要通过$emit向上触发事件，然后监听事件，最后才会执行方法函数，比如下面这样的：
- <div id="root">
- <child @click="handleClick"></child>
- </div>
- <script>
- Vue.component('child',{
- template: '<div @click="handleChildClick">child</div>',
- methods: {
- handleChildClick: function () {
- this.$emit('click')
- }
- }
- })
- var vm = new Vue({
- el: '#root',
- methods: {
- handleClick: function () {
- alert('handleClick方法')
- }
- }
- })
- </script>
然后点击组件就会执行 alert('handleClick方法')，但是发现没，这样的话很麻烦，那么有没有更简单的执行方法呢？有的，就是这样，添加一个.native修饰符，如下：
- <div id="root">
- <child @click.native="handleClick"></child>
- </div>
- <script>
- Vue.component('child',{
- template: '<div>child</div>'
- })
- var vm = new Vue({
- el: '#root',
- methods: {
- handleClick: function () {
- alert('handleClick方法')
- }
- }
- })
- </script>
这样一来，就是一个原生的点击事件，是不是很方便呢？
微信小程序
互联网开发，终身学习者，欢迎您的关注！
