Question

我花了很多时间来弄清楚今天开发反应应用程序应该是什么样的正确堆栈，我得出的结论是我需要做出反应，反应路由器，还原和还原和传播。

我设法写了一些东西，但现在我陷入了简单的数据迭代过程。例如，下面的代码将打印从服务器返回的格式化数据。

import React from 'react';

import { bindActionCreators } from "redux";
import { connect } from "react-redux";

import { requestApiData } from "../actions";

class About extends React.Component {
  componentDidMount() {
    this.props.requestApiData();
  }

  render() {
    return (
      <div>
        <pre>
          {JSON.stringify(this.props.data, null, 2)}
        </pre>
      </div>
    );
  }
}

const mapStateToProps = state => ({ data: state.data });

const mapDispatchToProps = dispatch =>
  bindActionCreators({ requestApiData }, dispatch);

export default connect(mapStateToProps, mapDispatchToProps)(About);

但是当我改变我的渲染方法时，就像这样：

renderPosts() {
    return this.props.data.map((post, index) => {
      return (
        <article key={post.sys.id}>
          <h3>{post.fields.title}</h3>
          <p>{post.fields.description}</p>
        </article>
      );
    });
  }
  render() {
    return (
      <div>
        <h2>Blog Posts</h2>
        {this.renderPosts()}
      </div>
    );
  }

我会得到＆＃34; TypeError：this.props.data.map不是函数＆＃34;。如果我认为这与异步加载正确相关，那就是。

简单的问题是如何解决这个问题，或者在哪里选择更详细的指南，以便我可以弄清楚如何正确地做到这一点。

React，redux，saga this.props.data不可用于迭代

0 个答案: