ホームページ  >  記事  >  ウェブフロントエンド  >  React+maxlength が有効にならない場合の対処方法

React+maxlength が有効にならない場合の対処方法

藏色散人
藏色散人オリジナル
2022-12-30 14:08:082630ブラウズ

react maxlength が有効にならない場合の解決策: 1. 対応する React ファイルを開きます; 2. "maxlength" を "maxLength" に変更します。コードは "e510679e66b339875af1b8f66b78b0a996ac42c95369ad8c9dbbd274b6bcc83a"。

React+maxlength が有効にならない場合の対処方法

このチュートリアルの動作環境: Windows 10 システム、react18.0.0 バージョン、Dell G3 コンピューター。

react maxlength が有効にならない場合はどうすればよいですか?

問題の説明:

React 入力がありますが、maxlength が機能しません。この問題の解決方法を知っている人はいますか?

これは handleChangeInputです

handleChangeInput(input) {    this.setState({
        ...this.state,        form: {
            ...this.state.form,
            [input.target.name]: input.target.value
        }
    })
}

これは私の意見です:

<div className="input-field col s12 m6 l6">
    <input onChange={this.handleChangeInput} value={this.state.form.message} type="text" className="phone validate" name="phone" maxlength="11"/>
    <label for="telefone">Telefone</label>
</div>

問題解決策:

maxlength を maxLength に変更します!大文字のLに注目してください。

<input
    id="ZIPCode"
    className="form-control"
    type="text"
    maxLength={10} // this is the important line
></input>

React は CamelCased HTML 属性を使用するため、maxlength は maxLength になります。

推奨される学習: 「react ビデオ チュートリアル

以上がReact+maxlength が有効にならない場合の対処方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。