问题: 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>