This is a react native project. My compiler finds the item variable to be undefined even though I used item in a function

Question

I am trying to fix my routes in react native, to do so I'm using the item variable to navigate through my pages.

<TouchableOpacity
  style={{
    padding: 20,
    flexDirection: "row",
    backgroundColor: colors.background,
    justifyContent: "flex-end",
    alignItems: "center",
  }}
  onPress={navigation.navigate("Edit", { id: item.id })}
>
  <Text style={{ fontSize: 24 }}>Task</Text>
  <MaterialCommunityIcons
    name="plus"
    size={40}
    style={{
      color: colors.themeColor,
      backgroundColor: colors.white,
      borderRadius: 20,
      marginHorizontal: 8,
    }}
  />
</TouchableOpacity>

Answer 1

First use {()=> navigation.navigate("Edit", { id: item.id })}.If you are not using item variables in your code it will give you undefined. for example, if your id variable is a person so try using person.id. On the next page use route.params.person.