Vue之点击事件

最新推荐文章于 2024-07-22 15:13:59 发布

周末笔记

最新推荐文章于 2024-07-22 15:13:59 发布

阅读量4k

点赞数

文章标签： vue event javascript

本文链接：https://blog.csdn.net/weixin_40016215/article/details/114630106

版权

一、 @keyup.enter.native

一般vue的监听组件，是这样写

<input v-on:keyup.enter="submit">

<input @keyup.enter="submit">

但是，如果用了封装组件的话，比如element，这个时候使用按键修饰符需要加上.native

<el-input 
	v-model="account" 
	placeholder="请输入账号" 
	@keyup.enter.native="search()"
>
</el-input>

二、@click.native.prevent

1.在封装好的组件上使用，所以要加上.native才能click

2.prevent就相当于event.preventDefault()

preventDefault() 方法阻止元素发生默认的行为（例如，当点击提交按钮时阻止对表单的提交）

根据Vue2.0官方文档关于父子组件通讯的原则，父组件通过prop传递数据给子组件，子组件触发事件给父组件。但父组件想在子组件上监听自己的click的话，需要加上native修饰符，故写法就像上面这样。

关注