React Native alert message-CodePudding

new to react native here, so i'm trying to send different alert message when user click on different buttons. But i'm not sure how to do it. Here's my code:

So what will happen is when user click on EXCITED they will receive a alert message and when they click on FINE they will receive another alert message which will say a different thing does anyone know how to do it?

const DATA = [

  {
    id: "1",
    title: "EXCITED",
  },

  {
    id: "2",
    title: "HAPPY",
  },

  {
    id: "3",
    title: "FINE",
  },

  {
    id: "4",
    title: "NOT GOOD",
  },

  {
    id: "5",
    title: "BAD",
  },

];



const Item = ( { item, onPress, style } ) => (

  <TouchableOpacity onPress={onPress} style={[styles.item, style]}>

    <Text style={styles.title}>{item.title}</Text>

  </TouchableOpacity>

);

const Motivation = ({ navigation }) => {

  const [selectedId, setSelectedId] = useState(null);

  const renderItem = ({ item }) => {

    const backgroundColor = item.id === selectedId ? "#e6e6e6" : "#F0E6E6";

    return (

      <Item
        item={item}
        onPress={() => setSelectedId(item.id)}
        style={{ backgroundColor }}
      />

    );
  };

CodePudding user response：

Try Alert by react-native call it using switch for different moods

CodePudding user response：

From your above code, I can't see using any FlatList or Data mapping. If you did all that then just import Alert and call it in onPress function like below

import {Alert} from 'react-native;
...

  <Item
    item={item}
    onPress={() => {setSelectedId(item.id),Alert.alert(item.title,'your alert message here')}}
    style={{ backgroundColor }}
  />

CodePudding user response：

try this for different type of notification message. https://www.npmjs.com/package/react-native-flash-message