美文网首页
Element UI 的el-input同时绑定@keyup.e

Element UI 的el-input同时绑定@keyup.e

作者: 焦糖大瓜子 | 来源:发表于2018-03-01 18:08 被阅读0次

问题: el-input框同时绑定键盘事件和blur事件,造成两次提交

Before:

keyup事件触发后,blur同样会被触发,造成两次提交handleInputConfirm方法。

<div class="keyword-content">
    <el-input
            class="input-new-tag"
            v-if="inputVisible"
            v-model="inputValue"
            ref="saveTagInput"
            size="small"
            @keyup.enter.native="handleInputConfirm"
            @blur="handleInputConfirm">
    </el-input>
</div>

After:

解决方法:使用keyup事件触发blur事件

<div class="keyword-content">
    <el-input
            class="input-new-tag"
            v-if="inputVisible"
            v-model="inputValue"
            ref="saveTagInput"
            size="small"
            @keyup.enter.native="$event.target.blur"
            @blur="handleInputConfirm">
    </el-input>
</div>

相关文章

网友评论

      本文标题:Element UI 的el-input同时绑定@keyup.e

      本文链接:https://www.haomeiwen.com/subject/virnxftx.html