限制最大长度的输入

Question

我需要一个只接受十六进制字符并需要提供最大长度的输入框。

我只能处理接受十六进制，但我遇到问题的地方是粘贴字符串时 - 无效字符也被计算在最大长度中。

这是我目前拥有的：

<q-input outlined v-model="text" label="Outlined" @input="acceptHexOnly" maxlength="6"></q-input>

和：

acceptHexOnly () {

  console.log(this.text)

  this.$nextTick(() => {

    this.text = this.text.replace(/[^a-fA-F0-9\n\r]+/g, '').toUpperCase()

  })

}

所以在粘贴字符串时：

xabx12xcdxef

预期的：AB12CD

实际的：AB12

帮助！

小提琴： https: //codepen.io/keechan/pen/qBZoXPj

Answer 1

从输入字段中删除 maxlength 属性并添加 .slice(0, 6) 如下acceptHexOnly () {&nbsp; console.log(this.text)&nbsp; this.$nextTick(() => {&nbsp; &nbsp; this.text = this.text.replace(/[^a-fA-F0-9\n\r]+/g, '').toUpperCase().slice(0, 6)&nbsp; })}