javascript - 更新的问题:this.props 显示无法读取未定义错误的属性“地图”
问题描述
我正在研究这个反应应用程序,在我现有的组件菜单中添加了一个新组件 DishDetail 后,不知何故 super(props) 停止工作,现在显示一个删除线,当我在 yarn 中启动我的反应应用程序时,它显示道具错误没有通过。
菜单组件
import React, { Component } from 'react'
import DishDetail from './DishdetailComponent'
import { Card, CardImg, CardImgOverlay, CardText, CardBody,
CardTitle } from 'reactstrap';
class Menu extends Component {
constructor(props) {
super();
console.log(props)
this.state = {
selectedDish: null
}
}
onDishSelect(dish) {
this.setState({ selectedDish: dish});
}
renderDish(dish) {
if (dish != null)
return(
<Card>
<CardImg top src={dish.image} alt={dish.name} />
<CardBody>
<CardTitle>{dish.name}</CardTitle>
<CardText>{dish.description}</CardText>
</CardBody>
</Card>
);
else
return(
<div></div>
);
}
render() {
const menu = this.props.dishes.map((dish) => {
return (
<div className="col-12 col-md-5 m-1">
<Card key={dish.id}
onClick={() => this.onDishSelect(dish)}>
<CardImg width="100%" src={dish.image} alt={dish.name} />
<CardImgOverlay>
<CardTitle>{dish.name}</CardTitle>
</CardImgOverlay>
</Card>
</div>
);
});
return (
<div className="container">
<div className="row">
{menu}
</div>
<DishDetail dish={this.state.selectedDish} />
</div>
);
}
}
export default Menu;
上一页:我无法解决问题,因为除了超级删除线之外,我的 Visual Studio 代码中没有检测到错误,所以请帮助我了解错误在哪里以及出了什么问题?
更新代码:自 2020 年 8 月的反应版本不再支持以来,将 super(props) 更改为 super()
**更新部分:** 我已经更新了我的代码,但它显示无法读取const menu = this.props.dishes.map((dish) =>
菜单组件中未定义错误的属性“映射”,我无法跟踪。
解决方案
推荐阅读
- android - 反向 AppBarLayout.ScrollingViewBehavior
- r - 将 SAS Proc Shewhart 转换为 R 编程
- php - mysqli_get_client_stats 是否向 sql server 发送请求
- printing - 修改与 gwbasic 一起使用的基本文件
- sql - 使用 django ORM 转换数据
- iphone - iPhone Xr 的刘海尺寸(以像素为单位)
- php - 如何在不重复代码的情况下根据变量更改 php if 语句?
- python - 在 python 中每次运行随机森林、非线性 SVC 和多项式 NB 时获得不同的准确度以进行文本分类
- r - 如何使用 ggplot 在 R 中绘制学生化残差和拟合值?
- powershell - Powershell - 移动文件后如何重命名文件?