TypeError：navigation.getParam 不是函数。 （在 'navigation.getParam('name')' 中，'navigation.getParam' 未定义）

Question

我正在嵌套屏幕并将道具传递给屏幕，例如标题标题和 json 渲染。 今天早些时候一切正常，但现在它给了我 getParams 的错误。

HomeStack.js，在标题中，我通过导航到此标题的屏幕中的 FlatList 渲染获得标题。

        <Screen
          name='errorHP'
          component={errorHP}
          options={{
            headerTitle: () => <Header navigation={navigation} title={navigation.getParam('name')} />,
            headerTitleAlign: 'center',}}
        /> 

HP.js，这里是flatlist渲染，并将渲染导出到页面errorHP

<FlatList data={filteredSearch} keyExtractor={(item) => item.key} renderItem={({item}) => (
                <TouchableOpacity onPress={() => navigation.navigate('errorHP', item)}>
                    <Card>
                        <Text style={globalStyles.titleText}> {item.name} </Text>
                    </Card>
                </TouchableOpacity>
            )} />

errorHP.js，这里列出了错误，点击后，将再次将参数传递到获取错误详细信息的新页面。

export default function errorHP ({navigation}) {
    const data = navigation.getParam('errors');
    const errors = Object.keys(data);
    return (
        <View style={globalStyles.container}>
            <FlatList data={errors} renderItem={({item}) => (
                <TouchableOpacity>
                    <Card>
                        <Text style={globalStyles.titleText}> {item} </Text>
                    </Card>
                </TouchableOpacity>
            )} />

我一直在搞乱，仍然无法解决这个问题。 感谢您的关注！

Answer 1

您需要从 route 属性中获取参数：

export default function errorHP ({navigation, route}) {
  const data = route.params.errors;

  // whatever
}

和

<Screen
  name="errorHP"
  component={errorHP}
  options={({ route, navigation }) => ({
    headerTitle: () => (
      <Header navigation={navigation} title={route.params.name} />
    ),
    headerTitleAlign: 'center',
  })}
/>