将代码提取到外部函数 React native

Question

我正在尝试将开关移出可触摸元素。我试图在常量上面写一个函数，但是控制台说“const dosomenthing =>(){console.log("hi")}”是一个对象而不是一个函数。

'

const GP = 'https://www.something.es/'
const [ruta, setRuta] = useState(GP + "?app=1");
return (
    <>
        <SafeAreaView style={{ flex: 1, backgroundColor: '#1C8EBC' }} forceInset={{ top: 'always' }} >

            <WebView
                androidHardwareAccelerationDisabled
                source={{ uri: ruta }}
                scalesPageToFit={true}
                onNavigationStateChange={(webViewState) => {setRuta(webViewState.url); console.log("algo")}}
            />
        </SafeAreaView>
        <FlatList
            style={styles.list}
            horizontal
            showsHorizontalScrollIndicator={false}
            contentContainerStyle={{ paddingBottom: 10, flex: 1, justifyContent: 'space-around', backgroundColor: '#001E35', paddingTop: 10 }}
            keyExtractor={(item) => item.name}
            data={tracks}
            renderItem={({ item }) => {
                return (
                    <TouchableOpacity onPress={function () {
                            
                            switch (item.name) {
                                case "inicio":
                                    tracks[0].icon = '/img/layout/appIcons/simbolo_inicio_activo_TS.png';
                                    tracks[1].icon = '/img/layout/appIcons/simbolo_tragaperras_TS.png';
                                    tracks[2].icon = '/img/layout/appIcons/simbolo_videobingo_TS.png';
                                    tracks[3].icon = '/img/layout/appIcons/simbolo_todobares_TS.png';
                                    setRuta(item.ruta)
                                    break;
                                case "tragaperras":
                                    tracks[0].icon = '/img/layout/appIcons/simbolo_inicio_TS.png';
                                    tracks[1].icon = '/img/layout/appIcons/simbolo_tragaperras_activo_TS.png';
                                    tracks[2].icon = '/img/layout/appIcons/simbolo_videobingo_TS.png';
                                    tracks[3].icon = '/img/layout/appIcons/simbolo_todobares_TS.png';
                                    setRuta(GP + item.ruta)
                                    break;
                                case "videobingo":
                                    tracks[0].icon = '/img/layout/appIcons/simbolo_inicio_TS.png';
                                    tracks[1].icon = '/img/layout/appIcons/simbolo_tragaperras_TS.png';
                                    tracks[2].icon = '/img/layout/appIcons/simbolo_videobingo_activo_TS.png';
                                    tracks[3].icon = '/img/layout/appIcons/simbolo_todobares_TS.png';
                                    setRuta(GP + item.ruta)
                                    break;
                                case "todobares":
                                    tracks[0].icon = '/img/layout/appIcons/simbolo_inicio_TS.png';
                                    tracks[1].icon = '/img/layout/appIcons/simbolo_tragaperras_TS.png';
                                    tracks[2].icon = '/img/layout/appIcons/simbolo_videobingo_TS.png';
                                    tracks[3].icon = '/img/layout/appIcons/simbolo_todobares_activo_TS.png';
                                    setRuta(GP + item.ruta)
                                    break;
                                default:
                                    break;
                            }
                         
                    }
                    }>
                        <Image
                            style={styles.image}
                            source={{ uri: GP + item.icon }}
                        />
                        <Text style={(GP + item.ruta == ruta || item.ruta == ruta ) && Platform.OS === 'ios' ? styles.titleColorPink : styles.titleIcon}>{item.name}</Text>
                    </TouchableOpacity>

                );
            }}
        />
    </>
);

}

常量轨道 = [ {名称：'inicio'，ruta：'https://www.something.es/?app=1'，图标：'/img/layout/appIcons/.png'}， {名称：'tragaperras'，ruta：'something?app=1'，图标：'/img/layout/appIcons/.png'}， {名称：'videobingo'，ruta：'/something?app=1'，图标：'/img/layout/appIcons/simbolo_videobingo_TS.png'}， { 名称：'todobares'，ruta：'/something?app=1'，图标：'/img/layout/appIcons/.png' } ]

Answer 1

我认为你没有正确定义你的函数。应该是这样的：

const doSomething = () => {
    console.log("hi");
}

然后，您可以像这样简单地将其传递给 TouchableOpacity：

<TouchableOpacity onPress={doSomething}>
   ...
</TouchableOpacity>