100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > vue element-ui el-input输入框绑定@keyup.enter回车事件无效

vue element-ui el-input输入框绑定@keyup.enter回车事件无效

时间:2022-01-05 23:15:35

相关推荐

vue element-ui el-input输入框绑定@keyup.enter回车事件无效

由于element-ui把input进行了封装,input外面是多一层div的。

在element-ui里有很多因为自身封装了几层标签导致事件和样式无法按想要的效果呈现,遇到后可以在网页中查看dom结构分析原因。

所以对于el-input,使用 @keyup.enter是无效的,需要加上.native限制符

.native修饰符的作用:

当想要在一个组件的根元素上直接监听一个原生事件,这时,就可以使用 v-on 的 .native 修饰符。

<el-inputv-model="serverTimer"@blur="addTimer"@keyup.enter.native="addTimer"placeholder="新增时间服务器"></el-input>

或者也可以直接原生input标签

<inputv-model="serverTimer"@blur="addTimer"@keyup.enter="addTimer"placeholder="新增时间服务器"></input>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。