Question

我对redux应用做出了反应，从Rest API获取订单项列表，然后将其放入充满redux的数组中。同一列表中有一个链接，可导航到订单的详细信息。导航到详细信息并按浏览器后退按钮以再次加载列表时，出现以下错误。

TypeError：fetchedOrders.map不是函数

这是订单列表容器中的代码

    componentDidMount() {
        this.props.handleFetchOrders(1);
    }

render() {

  { fetchedOrders && fetchedOrders.map(order => {
            return (
              <OrdersWE
                order={order}
                onDelete={onDelete}
                history = {this.props.history}
                key={order.OrderHID}
              />
            );
          })}

}

const mapDispatchToProps = dispatch => {
  return {    
    handleFetchOrders: (pageNumber) => {
      dispatch(fetchOrders(pageNumber));
    }
  };
};

Answer 1

您错过了return函数中的render语句，还必须返回一个ReactElement：

class App extends React.Component {
  ...
  render() {
    return (
      <>
        {fetchedOrders &&
          fetchedOrders.map(order => {
            return (
              <OrdersWE
                order={order}
                onDelete={onDelete}
                history={this.props.history}
                key={order.OrderHID}
              />
            );
          })}
      </>
    );
  }
}

此外，尝试记录fetchedOrders，根据错误消息，它可能不是数组对象。

浏览器“后退”按钮不触发componentDidMount（）反应生命周期方法

1 个答案: