未捕获的类型错误：无法读取未定义的属性“路径”-React答案

【问题标题】：Uncaught TypeError: Cannot read property 'path' of undefined - React未捕获的类型错误：无法读取未定义的属性“路径”-React
【发布时间】：2020-12-13 14:33:37
【问题描述】：

由于我无法解决 React 上的地图功能问题，我被卡住了！好吧，我正在使用marvel api来获取漫画的图片，名称，简短信息。

我应该如何定期更改相关代码。大家能知道是什么问题吗？我在附上添加屏幕。

以下问题图片

谢谢

【问题讨论】：

您应该在此处粘贴您的代码，而不是图片，因为我们更容易阅读/复制/粘贴它并为您提供帮助。您可以从 api 结果中获取数组的 50 项，所以我认为您应该检查每个项是否有缩略图对象？
是的，所有项目都有缩略图，正如 Dean James 我添加的那样，控制台现在可以随意查看数据，但仍然存在问题是它没有在前端显示卡信息。
代码如下所示； useEffect(() => { axios({ url: "gateway.marvel.com/v1/public/...", method: "GET", }) .then( result => { setStateCharacters({ characters : [result], ...stateCharacters }) const getInfo = result.data.data.results; getInfo.map((result) => { console.log(result.thumbnail.path); }) }) },[])
const RenderCard = (card, index) => { return( { card.thumbnail && } { card.name && {card.name} } ) }
return (
MARVEL CHARACTERS

我需要在这里调用 getInfo 组件然后我需要用 RenderCard 包装它，然后我相信它会起作用
> ) } export default ApiCalling;

标签： javascript arrays json reactjs map-function

【解决方案1】：

从您的错误中，您可以看到这是由于缺少缩略图属性。

您应该确保仅在缩略图存在时尝试使用它：

{card.thumbnail && <Card.Img variant="top" src={`${card.thumbnail.path}.${card.thumbnail.extension}`} style={...} />}

【讨论】：

嘿，你是对的。有thumbnai的属性，如果card.thumbnail为真，会被执行。我添加了，我正在控制台上查看数据，但数据未显示在前端。因为地图可能无法在前端获取信息。我正在共享屏幕。
代码如下所示； useEffect(() => { axios({ url: "gateway.marvel.com/v1/public/…", method: "GET", }) .then( result => { setStateCharacters({ characters : [result], ...stateCharacters }) const getInfo = result.data.data.results; getInfo.map((result) => { console.log(result.thumbnail.path); }) }) },[])
const RenderCard = (card, index) => { return( { card.thumbnail && ${card.thumbnail.path}.${card.thumbnail.extension}} style={{ width:"100%", height:"200px"}} /> } { card.name && {card.名称} } ) }
return (
MARVEL CHARACTERS

我需要在这里调用 getInfo 组件然后我需要用 RenderCard 包装它然后我相信它会工作
> ) } export default ApiCalling;