kusalshrestha / react-native-mention

Facebook like mention made in react native

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

React Native Mention 🚀

Facebook like mention input. Thanks to react-native-parsed-text

Demo

Installation

npm install --save react-native-mention
yarn add react-native-mention

Usage

import MentionInput from 'react-native-mention';

render() {
  return (
    <View style={styles.mainContainer}>
      <MentionInput
        reference={comp => {
          this.inputField = comp
        }}
        placeholder="Post something of worth"
        onChangeText={this.onChangeText}
        mentionData={this.state.mentionSuggestions}
        mentioningChangeText={this.mentioningChangeText}
        renderMentionCell={({ item }) => {
          return <MentionCell name={item.name} image={item.avatar} />
        }}
        style={styles.inputField}
      />
    </View>
  )
}

Properties

Prop Type Description
placeholder String Placeholder text.
mentionData Array(Object) Array of object. Basically suggestions to be mentioned.
onChangeText function On text change callback.
mentioningChangeText function on mention text callback.
renderMentionCell Element Element to show on mention suggestions.

License

MIT

About

Facebook like mention made in react native


Languages

Language:JavaScript 100.0%