我不知道这里出了什么问题，就我所知，我做的是正确的，因为它在我的应用程序中的其他地方都能正常工作。唯一的区别是，我试图从一个平面列表组件中做这个。这有什么问题吗？我还试图将{navigation}放在renderMyItem中，而不是放在FLToyCard括号中，也没有工作。我得到的错误是：TypeError: undefined is not an object (evaluating 'navigation.navigate') .

import { StyleSheet, Text, View, FlatList } from 'react-native'
import React from 'react'

import Toy from './Database'
import ToyCard from './ToyCard'

const FLToyCard = ({navigation}) => {
    
    const headerComp = () => {
        return(
            <View style={{alignSelf: 'center'}}>
                <Text style={{fontSize: 25, padding: 10}}>All Toys For Sale</Text>
            </View>
        )
    }
    
    const renderMyItem = ({item}) => {
        return(
            <View style={{flex: 1}}>
                <ToyCard 
                name={item.name}
                image={item.image}
                price={item.price}
                desc={item.desc}
                seller={item.seller}
                onPress={()=>navigation.navigate('SlugProduct')}
                />
            </View>
        )
    }
    
    return(
        <View>
            <FlatList 
                data={Toy}
                renderItem={renderMyItem}
                keyExtractor={(item)=>item.id}
                numColumns={2}
                ListHeaderComponent={headerComp}
            />
        </View>
    )
}

export default FLToyCard

这是我的App.js：

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
import { NavigationContainer } from '@react-navigation/native'
import { createNativeStackNavigator } from '@react-navigation/native-stack';

import SlugProduct from './Screens/SlugProduct';

export default function App() {
  const Stack = createNativeStackNavigator()
  return (
    <NavigationContainer>
        <Stack.Navigator initialRouteName='Login' >
             // list of other pages
             <Stack.Screen name="SlugProduct" component={SlugProduct} />
             <Stack.Screen name='ViewToys' component={ViewToys}
        </Stack.Navigator>
    </NavigationContainer>
  );
}

编辑：这是正在输入FLToyCard的ViewToys页面。我试着将onPress添加到Views和FLToyCard中，但每次都得到相同的错误。

import { StyleSheet, Text, View, ScrollView} from 'react-native'
import React from 'react'

import FLToyCard from '../Components/FlatListCards'

const ViewToys = ({navigation}) => {
  return (
    <View style={{backgroundColor: '#ffce20', height: '100%'}}>
      <View>
        <FLToyCard />
      </View>
    </View>
  )
}

export default ViewToys