vue 自定义组件@click无效
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="https://cdn.bootcss.com/vue/2.6.4/vue.js"></script>
<script src="https://cdn.bootcss.com/axios/0.19.0-beta.1/axios.js"></script>
<style type="text/css">
[v-cloak]{
display: none;
}
</style>
</head>
<body>
<div id="app" v-cloak>
<login :son="msg" @click="pop()"/>
</div>
</body>
</html>
<script>
new Vue({
el: "#app",
data:{
msg:'父组件'
},
methods:{
pop() {
console('点击事件')
}
},
components:{
login:{
template: "<h4>这是一个组件----{{son}}</h4>",
props:['son']
}
}
})
</script>
此时点击组件是没有任何输出的
问题描述： 组件中的事件 @click=“pop()” 是没有起作用的，点击事件失效了 解决方法： 在自定义的组件上如果想要绑定原生事件就必须的添加 .native 。即：@click.native="" 完美解决。
