Estoy estudiando sobre React-Native y tengo un problema. La etiqueta touchableOpacity no funciona en la pila nativa.

mi codigo es
Stack.js

 import React from "react"; import { createNativeStackNavigator } from "@react-navigation/native-stack"; import { Text, View, TouchableOpacity, TouchableNativeFeedback } from "react-native"; const ScreenOne = ({ navigation: { navigate } }) => ( // <TouchableOpacity onPress={(navigation) => navigate("Two")}> // add this code to check but didn't response <TouchableOpacity onPress={()=>alert('test')}> <Text>go to two</Text> </TouchableOpacity> ); const ScreenTwo = ({ navigation: { navigate } }) => ( <TouchableOpacity onPress={() => navigate("Three")}> <Text>go to three</Text> </TouchableOpacity> ); const ScreenThree = ({ navigation: { setOptions } }) => ( <TouchableOpacity onPress={() => setOptions({ title: "Hello!" })}> <Text>Change title</Text> </TouchableOpacity> ); const NativeStack = createNativeStackNavigator(); const Stack = () => ( <NativeStack.Navigator> <NativeStack.Screen name="One" component={ScreenOne} /> <NativeStack.Screen name="Two" component={ScreenTwo} /> <NativeStack.Screen name="Three" component={ScreenThree} /> </NativeStack.Navigator> ); export default Stack;

================================================== ======================
App.js

 import AppLoading from 'expo-app-loading'; import * as React from 'react'; import * as Font from 'expo-font'; import { Text, Image } from 'react-native'; import { Asset, useAssets } from 'expo-asset'; import {Ionicons} from '@expo/vector-icons' import { NavigationContainer } from '@react-navigation/native'; import Tabs from './navigation/Tabs'; import Stack from "./navigation/Stack"; export default function App() { // assets 나 loaded가 준비되지 않았다면 if(!assets || !loaded) { return <AppLoading></AppLoading>; } return ( <NavigationContainer> {/* <Tabs></Tabs> */} <Stack></Stack> </NavigationContainer> ); }

no hay mensaje de error. y quiero saber qué está mal con mis archivos.

gracias por leer mi problema