React组件数组props传递出现undefined错误的排查

直接删除ProjectList组件中那行额外的 <ProjectItem technologies={projects.technologies}/> 代码，只保留遍历projects数组渲染ProjectItem的逻辑即可。

问题根源解析 #

• projects是一个数组，本身不存在technologies属性，直接访问projects.technologies必然返回undefined
• 你的ProjectItem组件应该是在对传入的technologies调用map方法来渲染技术栈列表，当传入undefined时，自然会触发Cannot read property 'map' of undefined的错误
• 之前控制台能正常打印数组元素，是因为遍历projects数组时，每个ProjectItem拿到的是单个项目对象的technologies（正常数组），但额外添加的那行代码传入了无效的undefined，导致后续报错

内容的提问来源于stack exchange，提问作者Giselle Smith