How to Limit Maximum Number of Characters in React Native TextInput

Last Updated on December 10, 2020.

Sometimes you don’t want the user to input many characters through React Native TextInput component. Fortunately, react native TextInput has a prop to limit the characters the user enter.

The maxLength prop of TextInput limits the number of characters that can be entered. You can use it as given in the code given below:

<TextInput
        style={{height: 40, borderColor: 'gray', borderWidth: 1}}
        onChangeText={(text) => this.setState({text})}
        value={this.state.text}
        maxLength = {8}
      />

As you see, the maximum number of characters that can be entered is limited to 8 in the example given above. Have any doubts? Take a look at the official React Native document here.

Leave a Reply

%d bloggers like this: