给组件绑定原生事件 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>给组件绑定原生事件</title>
    <script src="./vue.js"></script>
</head>
<body>
    <div id="root">
        <child @click.native="handleClick"></child>
        <!--native告诉浏览器要触发原生的自定义事件-->
    </div>
    <script>
        Vue.component('child',{
            // template:'<div @click="handleClick">Child</div>',
            // methods:{
            //     handleClick:function () {
            //         // alert('child click');
            //         this.$emit('click') //触发自定义事件
            //     }
            // }
            template:"<div>Child</div>"
        });
        var vm = new Vue({
            el:'#root',
            methods:{
                handleClick:function () {
                    alert('原生click')
                }
            }

        })
    </script>
</body>
</html>

 

posted @ 2018-11-20 11:17  alexbiu  阅读(208)  评论(0)    收藏  举报