我在输入数字字段上有以下代码:
<input class="quantity_container" v-model="length.quantity"
type="number" pattern="[0-9]*" inputmode="numeric"
onfocus="if (this.value == '0') this.value = '';"/>
如果在切换到其中包含“0”的新输入字段之前没有其他输入字段处于焦点状态，则用于清除该字段的代码将起作用。该页面有很多输入字段，不幸的是我无法通过名称访问它们。我已经检查过，onfocus 正在被调用，但是当该字段为“0”并将焦点从一个输入字段移动到另一个输入字段时，该字段永远不会被清除。
只有当我点击并移除最后一个输入字段的焦点，然后将焦点放在新输入字段上时，它才会清除。
非常感谢任何帮助。
最佳答案
我将通过创建 custom input component 来实现此目的。例如
Vue.component('quantity-input', {
template: '<input type="number" class="quantity_container" inputmode="numeric" ref="input" :value="value" @input="updateValue($event.target.value)" />',
props: ['value'],
methods: {
updateValue: function(value) {
var formattedValue = value == 0 ? '' : value
if (formattedValue !== value) {
this.$refs.input.value = formattedValue
}
this.$emit('input', formattedValue)
}
}
})
然后您可以简单地使用
<quantity-input v-model="length.quantity"></quantity-input>
关于Javascript 清除输入字段，将焦点从一个输入字段移动到另一个输入字段，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45294359/