@esteemapp/react-native-tags
v1.3.1
Published
Tag input component for React Native
Downloads
6
Readme
React-Native-Tags
A React Native component that allows you to input text and formats the text into a tag when a space or comma is entered. Tapping on the tag will remove it.
Installation
npm install --save react-native-tags
yarn add react-native-tags
Usage
import React from "react";
import Tags from "react-native-tags";
const UselessComponent = () => (
<Tags
initialText="monkey"
initialTags={["dog", "cat", "chicken"]}
onChangeTags={tags => console.log(tags)}
onTagPress={(index, tagLabel, event, deleted) =>
console.log(index, tagLabel, event, deleted ? "deleted" : "not deleted")
}
containerStyle={{ justifyContent: "center" }}
inputStyle={{ backgroundColor: "white" }}
/>
);
Props
| PropName | Description | Default |
| ----------------- | ------------------------------------------ | -------- |
| initialText | The input element's text | |
| initialTags | ['the', 'initial', 'tags'] | |
| onChangeTags | Fires when tags are added or removed | |
| maxNumberOfTags | The max number of tags that can be entered | infinity |
| onTagPress | Fires when tags are pressed | |
| readonly | Tags cannot be modified | false |
| deleteTagOnPress | Remove the tag when pressed | true |
| containerStyle | Style | |
| style | Style (containerStyle
alias) | |
| inputStyle | Style | |
| tagContainerStyle | Style | |
| tagTextStyle | Style | |