I have 3 screens. Screen one contains the FlatList:

const navigation = useNavigation()

    function whereTo(id) {

        console.log(id)

        switch(id) {

            case 1: 
                navigation.navigate('Malko')

            case 2:
                navigation.navigate('TRY2')
        }
    }

    const renderItem = ({ item }) => {

        return (
            <TouchableOpacity onPress={() => whereTo(item.id)}>

                <CalculatorCard text={item.text} image={item.imageurl} border={item.bordercolor} />

            </TouchableOpacity>
        )
    }

    return (

        <View style={styles.container}>

            <FlatList

                data={DATA}
                renderItem={renderItem}
                keyExtractor={item => item.id}
            />

        </View>
    )

The CalculatorCard is just a simple information card component. Data for the FlatList:

const DATA = [

    {
        id: 1,
        text: "EXAMPLE 1",
        imageurl: "https://maisgeek.com/wp-content/uploads/2020/10/shutterstock_1006988770.png",
        bordercolor: "rgb(0, 100, 180)"
    },
    {
        id: 2,
        text: "EXAMPLE 2",
        imageurl: "https://images.ctfassets.net/lzny33ho1g45/T5qqQQVznbZaNyxmHybDT/b76e0ff25a495e00647fa9fa6193a3c2/best-url-shorteners-00-hero.png?w=1520&fm=jpg&q=30&fit=thumb&h=760",
        bordercolor: "rgb(0, 180, 255)"
    },
    {
        id: 3,
        text: "EXAMPLE 3",
        imageurl: "https://neilpatel.com/wp-content/uploads/2019/05/imagem-de-tela-de-uma-url.jpeg",
        bordercolor: "rgb(0, 160, 140)"
    },
]

Both the Malko and the TRY2 screen are empty screens with just a Text component. The problem is that when I click the first CalculatorCard, the id that gets passed to whereTo() is 1, however I get redirected to TRY2 instead of Malko.

CodePudding user response：

You need to add break in case;

 switch(id) {

        case 1: 
            navigation.navigate('Malko');
            break;

        case 2:
            navigation.navigate('TRY2');
            break;
    }