错误：未定义不是对象(评估"选定类别标题")。有谁知道如何解决这个问题？我使用的是旧语法吗？

Question

这是我的代码:

import React from "react";
import { View, Text, Button, StyleSheet, Platform } from "react-native";
import { CATEGORIES } from "../data/dummy-data";
import Color from "../constants/Color";

这些是我所有的导入

const CategoryMealScreen = (props) => {

这是main函数

const catId = props.navigation.getParam("categoryId");
const selectedCategory = CATEGORIES.find((cat) => cat.id === catId);

选定类别是一个常量，用于文本

return (
<View style={styles.screen}>
<Text>The Category Meal Screen!</Text>
<Text>{selectedCategory.title}</Text>
<Button
title="Go to Details"
onPress={() => {
props.navigation.navigate({
routeName: "MealDetail",
});
}}
/>
<Button
title="Go Back"
onPress={() => {
props.navigation.pop();
}}
/>
</View>
);
};
CategoryMealScreen.navigationOptions = (navigationData) => {
const catId = navigationData.navigation.getParam("categoryId");
const selectedCategory = CATEGORIES.find((cat) => cat.id === catId);
return {
headerTitle: selectedCategory.title,
headerStyle: {
backgroundColor: Platform.OS === "android" ? Color.primaryColor : "",
},
headerTintColor: Platform.OS === "android" ? "white" : Color.primaryColor,
};
};

这是我使用的样式表

const styles = StyleSheet.create({
screen: {
flex: 1,
justifyContent: "center",
alignItems: "center",
},
});
export default CategoryMealScreen;

我猜问题是来自变量选择类别，但我不知道如何解决它请帮

Answer 1

错误告诉您在selectedCategory变量中没有对象。最明显的原因是您的find没有找到匹配项。

如果您从您的虚拟数据console.log您的CATEGORIES，并从参数catId，您应该能够看到什么是错误的。可能是缺少了catId，或者没有包含该ID的类别。