问题说明:
使用uniapp开发小程序,用到了增强输入框easyinput,在进行实机测试时,点击输入框中的清除按钮,有时候会发生输入框内容未清除的情况,现在提供解决方法。这个方法是我尝试了多次琢磨出来的,亲测可用。
解决方法:
找到自己的项目中的增强输入框组件vue文件uni-easyinput.vue,修改文中的onClear方法。对输入值进行异步修改,使用this.$nextTick实现,以防止因父子组件数值关联造成输入值修改后又恢复的情况。
修改前:
/**
* 清理内容
* @param {Object} event
*/
onClear(event) {
this.val = '';
// TODO 兼容 vue2
this.$emit('input', '');
// TODO 兼容 vue2
// TODO 兼容 vue3
this.$emit('update:modelValue', '');
// 点击叉号触发
this.$emit('clear');
}
修改后:
/**
* 清理内容
* @param {Object} event
*/
onClear(event) {
this.$nextTick(() => {
this.val = '';
// TODO 兼容 vue2
this.$emit('input', '');
// TODO 兼容 vue2
// TODO 兼容 vue3
this.$emit('update:modelValue', '');
// 点击叉号触发
this.$emit('clear');
})
}