【问题标题】:params undefined is not an object in route react native参数未定义不是路由反应本机中的对象
【发布时间】:2020-10-27 08:48:36
【问题描述】:

我已经创建了一个组件列表详细信息屏幕和列表项中的列表项它有一张卡片当人们单击卡片时它会显示listingDetailScreen 当突然单击我想制作一个底部选项卡导航器并且在底部选项卡导航器中我已经通过了组件列出详细信息,但它通过错误 undefined is not an object 这是我的列表屏幕代码 这个婴儿车在堆栈导航器中没有给我任何错误,但它在选项卡导航器中显示错误

const listings = [
  {
    id: 1,
    title: "Close your eyes",
    price: 10,
    image: require("../assets/child.png"),
  },
  {
    id: 2,
    title: "dare to surrender",
    price: 15,
    image: require("../assets/blur.png"),
  },
];
export default function ListingsScreens({ navigation }) {
  return (
    <ExpoScreen style={styles.screen}>
      <FlatList
        data={listings}
        keyExtractor={(listings) => listings.id.toString()}
        renderItem={({ item }) => (
          <CardList
            title={item.title}
            subtitle={"$" + item.price}
            image={item.image}
            onPress={() => navigation.navigate("ListingDetails", item)}
          />
        )}
      />
    </ExpoScreen>
  );
}

这是我的 Screendetailscreen

export default function ListingDetailsScreen({ route }) {
  console.log(route);
  const listing = route.params;
  return (
    <View style={styles.Screen}>
      <View style={styles.card}>
        <Image style={styles.CardImage} source={listing.image} />

        <View style={styles.tittleContainer}>
          <AppText style={styles.title}>{listing.title}</AppText>
          <AppText style={styles.subtitle}>{listing.price}</AppText>
        </View>
      </View>
      <ListItem
        image={require("../assets/dummyFemale.png")}
        title="Anna bella"
        sutitle="suck 5 person blood"
      />
    </View>
  );
}

在这我做了一个标签导航器

const Tab = createBottomTabNavigator();
const AppNavigation = () => (
  <Tab.Navigator>
    <Tab.Screen name="Feed" component={FeedNavigator} />
    <Tab.Screen name="ListingEdit" component={ListingDetailsScreen} />
    <Tab.Screen name="Account" component={AccountNavigator} />
  </Tab.Navigator>
);

这是我的控制台参数是未定义的,但在堆栈中它不是未定义在选项卡中它给出未定义

Object { "key": "ListingEdit-oK0Wojum1iGcbBIxCnxNV", "name": "ListingEdit", "params": undefined, }

export default AppNavigation;

【问题讨论】:

    标签: react-native


    【解决方案1】:

    在堆栈导航中,您正在传递如下所示的项目

    onPress={() => navigation.navigate("ListingDetails", item)}
    

    但是标签导航你没有传递任何东西,但是你可以传递一个如下的初始参数

      <Tab.Screen name="ListingEdit" component={ListingDetailsScreen} initialParams={item}/>
    

    其中项目是 AppNavigation 函数中的变量。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2017-09-28
      • 1970-01-01
      • 2018-07-18
      • 1970-01-01
      • 1970-01-01
      • 2019-10-05
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多