react+maxlength不生效怎麼辦

react maxlength不生效的解決方法：1、開啟對應的react檔案；2、將「maxlength」修改成「maxLength」即可，程式碼如「ee0d447f4098738567b013e4aca6dd8296ac42c95369ad8c9dbbd274b6bcc83a」。

本教學操作環境：Windows10系統、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中文網其他相關文章！