Xayyna
Xayyna

Reputation: 51

How to get the touchableOpacity function to work correctly?

When I press on "Immunity boosting" the correct Pressedinfo shows up, so its original function works, but the problem is it also alerts citrus, and when I click the touchableOpacity thats supposed to alert Citrus but I don't get any alerts when I'm supposed to, Please check code down below.........................................

export default function LinksScreen() {
  const citrusAlert = () => Alert.alert("Citrus ");
  const [Pressedinfo, setPressedInfo] = useState(null)
  const pressHandler = (id) => {
    if (id == 1) {
      setPressedInfo(
        <View>
          <View style={Styles.component}>
            <Image source={home} style={Styles.home} />
            <Text style={Styles.Text2}>#Stay home, Save lives</Text>
          </View>
          <View style={Styles.component}>
            <Image source={distanceimg} style={Styles.distance} />
            <Text style={Styles.Text2}>Keep a safe distance</Text>
          </View>
          <View style={Styles.component}>
            <Image source={washinghands} style={Styles.distance} />
            <Text style={Styles.Text2}>Wash hands often</Text>
          </View>
          <View style={Styles.component}>
            <Image source={coverimg} style={Styles.distance} />
            <Text style={Styles.Text2}>Cover your cough</Text>
          </View>
          <View style={Styles.component}>
            <Image source={sickimg} style={Styles.distance} />
            <Text style={Styles.Text2}>Sick? Call for help</Text>
          </View>
        </View>
      )
    } else if (id == 2) {
      setPressedInfo(<View>
        <TouchableOpacity onPress={citrusAlert()} style={Styles.component}>
          <Image source={citrus} style={Styles.distance} />
          <Text style={Styles.Text2}>Citrus (Vitamin C)</Text>
        </TouchableOpacity>
        <View style={Styles.component}>
          <Image source={bellp} style={Styles.distance} />
          <Text style={Styles.Text2}>Red Bell Peppers</Text>
        </View>
        <View style={Styles.component}>
          <Image source={broc} style={Styles.distance} />
          <Text style={Styles.Text2}>Broccoli</Text>
        </View>
        <View style={Styles.component}>
          <Image source={garlic} style={Styles.distance} />
          <Text style={Styles.Text2}>Garlic</Text>
        </View>
        <View style={Styles.component}>
          <Image source={ginger} style={Styles.distance} />
          <Text style={Styles.Text2}>Ginger</Text>
        </View>
        <View style={Styles.component}>
          <Image source={spinach} style={Styles.distance} />
          <Text style={Styles.Text2}>Spinach</Text>
        </View>
  
   
      </View>)
    } else if (id == 3) {
      setPressedInfo(<View>
        <View style={Styles.component}>
          <Text style={Styles.Text3}>Stay Home and Call a Health Care Provider</Text>
        </View>
      </View>)
    }
  }
  return (
    <ScrollView style={Styles.scrv} >
      <View style={Styles.container} >
        <TouchableOpacity onPress={() => pressHandler(1)}>
          <View style={Styles.container2}>
            <Image source={img5} style={Styles.Hand} />
            <Text style={Styles.Text1}> 5 rules of prevention</Text>
          </View>
        </TouchableOpacity>
        <TouchableOpacity onPress={() => pressHandler(2)}>
          <View style={Styles.container2}>
            <Image source={food} style={Styles.Hand} />
            <Text style={Styles.Text1}>Immunity boosting</Text>
          </View>
        </TouchableOpacity>
        <TouchableOpacity onPress={() => pressHandler(3)}>
          <View style={Styles.container2}>
            <Image source={sickimg} style={Styles.Hand} />
            <Text style={Styles.Text1}>Feeling Sick?</Text>
          </View>
        </TouchableOpacity>

      </View>
      {Pressedinfo}
    </ScrollView>
  )
}

Upvotes: 0

Views: 28

Answers (1)

mainak
mainak

Reputation: 2311

change onPress={citrusAlert()} to onPress={citrusAlert}

Upvotes: 1

Related Questions