react-textarea-count
Simple textarea chars counter for React
Installation
npm i react-textarea-count -S
Usage Example
This is a dead simple plugin to count textareas length with ease. By default a textarea is rendered wrapped inside a .textarea__wrapper
container. Inside of this resides the textarea itself and a span element with class .textarea__count
with the text's length:
<Textarea />
and output:
0
If you want to show a limit then you have to pass a countLimit
prop so it can become visible:
<Textarea = />
and output:
0/10
Since countLimit
is passed then everytime the length is bigger than that limit a textarea__count--error
class is applied to the counter. That way you can style it at while:
11/10
If you want to hide the counter in a specific case you can use prop countShow
and set it to false:
<Textarea = = />
and output:
API
Props
Property | Type | Default | Description |
---|---|---|---|
countLimit |
number |
0 |
Chars limit. It is optional and if it is not used then chars limit is not shown |
countShow |
bool |
true |
Just in case you want to hide the counter you can set this to false |
License
This project is licensed under the MIT License