模块解析错误 & 无法读取未定义的属性答案

【问题标题】：Module parse error & cannot read properties of undefined模块解析错误 & 无法读取未定义的属性
【发布时间】：2022-11-15 00:25:24
【问题描述】：

我正在制作一个 React 文件，这个问题来了： TypeError: Cannot read properties of undefined (reading 'map')

  35 |                </Select>
  36 |            </FormControl>
  37 | 
> 38 |            <Grid container spacing={3} className={classes.list}>
     | ^  39 |                {places.map((place, i) => (
  40 |                    <Grid item key={i} xs={12}>
  41 |                        <PlaceDetails place={place}/>

我在网上发现我可以通过在{places.map...}上应用?.来解决这个问题，然后它将是{places?.map...。我解决了第一个问题，但不幸的是，当我保存更改时发生了这种情况： ` ./src/components/List/List.jsx 153:12 模块解析失败：意外令牌 (153:12) 您可能需要一个合适的加载器来处理这种文件类型。 |列数：13 | }

}, 地点?.map(function (place, i) { |返回 /#纯的/React.createElement(Grid, { | item: true, `

有谁知道我需要做什么来解决这个问题？我是否使用?. 做出了正确的选择，或者我需要做出一些不同的事情？

我知道在我的项目中无法识别?.（我不知道为什么），但我知道他可以解决我的问题。这是我找到?. 解决方案的地方

【问题讨论】：

在尝试渲染之前，您是否检查了要映射的数组是否存在？

标签： javascript reactjs web babeljs babel-loader

【解决方案1】：

改变

{places.map...

至

{places && places.map...

所以当places 是假的时它不会尝试显示这些地方。

【讨论】：