入力を1桁の数字に制限する

Question

vueJSにはv-modelを使用してバインドされた入力があります。

私はそれが唯一とすぐに一桁がボックス内にあるとして1と6の間、一桁になるように、追加のキーを押すには何の影響も与えないはず、この入力に制限を配置したい

<input type="number" v-model.number="testinput"> 

。 9などの無効な数字を入力しても効果はありません。

これに最も適した方法がわからない場合は、ディレクティブ、フィルタ、イベントハンドラが必要なのでしょうか、新しいカスタム入力コンポーネントを作成する必要がありますか？

Answer 1

1. 入力フィールドでmaxlengthプロパティを1に設定します（これは1文字に制限されます）。

2. patternプロパティを使用して適切な正規表現を入力フィールドに追加します。 （これは、入力が1文字のみで、1〜5の数字を使用していることを確認します。

   <input type="number" maxlength="1" pattern="([12345])\w{0}" v-model.number="testinput">