React - set input max length

In this article, we would like to show you how to set input max length in React.

Quick solution:

<input maxLength={5} />

Hint: change 5 to desired input max length.

Practical example

In this example, we use maxLength property to set input max length to 5 characters.

Runnable example:

// ONLINE-RUNNER:browser;

// Note: Uncomment import lines in your project.
// import React from 'react';

const App = () => {
    return (
        <div>
          <label>
            <span>Type max 5 characters:</span>
            <input maxLength={5} />
          </label>
        </div>
    );
};

const root = document.querySelector('#root');
ReactDOM.render(<App />, root);