0.1.1 • Published 6 years ago
react-native-badge-input v0.1.1
React Native Badge Input
Modular badge input for React Native
Installation
yarn add react-native-badge-inputUsage
import React, { useState } from 'react'
import BadgeInput from 'react-native-badge-input'
let Example = () => {
let [value, setValue] = useState('')
let [badges, setBadges] = useState([])
let addBadge = badge =>
setBadges([...badges, badge])
let removeBadge = removedBadge =>
setBadges(
badges.filter(badge => badge !== removedBadge)
)
return (
<BadgeInput
value={value}
onChangeText={setValue}
badges={badges}
onBadgePress={removeBadge}
onSubmitEditing={addBadge}
/>
)
}Props
| name | required | default | description |
|---|---|---|---|
| value | yes | Current input value | |
| onChangeText | yes | TextInput onchangeText | |
| badges | yes | An array of badges | |
| onBadgePress | yes | Badge on press action | |
| placeholder | no | Input placeholder. | |
| inputSuffix | no | Content rendered at the end of the input, for example an icon. | |
| badgeStyle | no | Badge component style | |
| inputProps | no | Props additionally passed to input. This is useful if you want to pass any styles that are overriden by the props object. | |
| keyExtractor | no | () => string | Badge key extractor. |
| textExtractor | no | () => string | Badge text extractor, required when your badge is not a string. |