Reactのinput部品をバリデートする

Reactのinput部品をバリデートする

Reactでinput部品を扱う」を投稿しましたが、今度は入力値をバリデートしてみます。

入力値はstateを使用して管理するので、this.setStateする前に入力値をチェックします。

以下は数値以外は入力できないようにした部品の例です。

サンプル

フォーマットをバリデートする

例えば携帯番号のフォーマットはxxx-xxxx-xxxxというフォーマットの数値となります。

このフォーマットをバリデートしたい場合はJSの正規表現を使用してバリデートします。

バリデートする前に数値とハイフン以外は入力できないようにしておきます。

サンプル

Reactのinput部品をバリデートする

スポンサーリンク
  • このエントリーをはてなブックマークに追加
  • Evernoteに保存Evernoteに保存
スポンサーリンク

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA