React Native route.params 未定義

Question

我一直在嘗試使用 navigation.navigate('Merchant', store) 將數據從 home.js 屏幕傳遞到 Merchant.js 屏幕，但是當我嘗試實際使用 route.params 時，我得到了未定義。

這是我的 home.js

export default function Home( { navigation }) {
...
{storeData.map(store => {
    return (
     <View>
      <TouchableOpacity>
        <Text style={styles.categoryName}
          onPress={() => {navigation.navigate('Merchant', store)}}>
         {store.name}
        </Text>
      </TouchableOpacity>

商人.js

function Merchant({ navigation, route }) {
    console.log(route);
...
}

Output：

{“key”：“Merchant-86K9u5ytF32VGMRcO9s2g”，“name”：“Merchant”，“params”：未定義}

我再次不知道發生了什么。 我試過navigation.push()，我試過使用navigation('Merchant', {name: store.name})，但我仍然沒有定義。

如果您想使用我的堆棧導航粘貼更多代碼，我可以。

Answer 1

你試過這個嗎？

navigation.navigate('Merchant', store)

通過以下方式訪問值：

navigation.getParam('onePropertyOfStoreHere');

Answer 2

好吧，所以我想出了為什么它是未定義的。 這是因為我有另一個堆棧，頂部是 Merchant.js。

<Stack.Navigator initialRouteName="Merchant" headerShown='false'>
    <Stack.Screen name="Merchant" component={Merchant} />
    <Stack.Screen name="ProductInfo" component={ProductInfo}/>
  </Stack.Navigator>

當我從主屏幕移動到商家屏幕時，這一定會使應用程序感到困惑，但它進入了另一個堆棧。