React-native-chip-tags NPM

react-native-chip-tags

A react native component for editable chips tag

1.Run npm i react-native-chip-tags --save or yarn add react-native-chip-tags
2.import { TagArea } from 'react-native-chip-tags'

Screenshots

Add react-native-chip-tags to your js file.

import { TagArea, Chip } from 'react-native-chip-tags'

Inside your component's render method, use TagArea:

 render() {
         return (
             <TagArea handleTagChanged={this._handleOnTagAdded} />
         );
 }

Props	Type	Optional	Default	Description
chipStyle	object	true	Gray background etc.	Custom chip style
tagWrapper	object	true	nothing	Custom wrapper position
editable	boolean	true	false	For editable data
pinChipIndex	boolean	true	false	For first chip change color to blue as default
handleOnChange	function	true	null	Handle on change
handleOnBlur	function	true	null	Handle on blur
chipsCount	number	true	5	Chip count
draftChips	array	true	[]	For render already filled tags
handleTagChanged	function	true	null	For hande tag change
maxLength	number	true	50	Max text lenght
multiline	number	true	false	For multi line

MIT Licensed by UE

react-native chip tag input chips tags

5 years ago

5 years ago

5 years ago