Question

我正在努力将a very, very simple video game从jQuery（重新）实现转换为我想成为惯用的ReactJS。我（尝试）使用the React tutorial作为参考。

jQuery重新实现将状态存储为字符数组的数组。我目前正试图获得在ReactJS中呈现的初始状态。最初我设置了getInitialState（）来返回最初返回的数据（数组数组）。这没有用，因为ReactJS似乎想要一个对象而不是一个数组（React.js: arrays and "Critical assumptions about the merge functions have been violated" error）。

教程，在＆＃34;教程10＆＃34; section，使用Array.map（），建议某些级别的包含Arrays可能会有所帮助：

现在，数据在CommentList中可用，让我们动态呈现注释：

// tutorial10.js
var CommentList = React.createClass({
  render: function() {
    var commentNodes = this.props.data.map(function (comment) {
      return (
        <Comment author={comment.author}>
          {comment.text}
        </Comment>
      );
    });
    return (
      <div className="commentList">
        {commentNodes}
      </div>
    );
  }
});

翻译字符网格（目前实现为数组数组）的最佳方法是什么？我是否将数组作为节点放在this.state上（状态可能会发生变化，所以我设置的是状态而不是道具）然后是一个Array.map（）（或者是二维的东西）？

Answer 1

什么是惯用的ReactJS处理方式？初始？状态？

理想情况下，默认数据作为prop（s）传递给根组件。 E.g。

React.render(
  <MyApp gid={grid} />,
  container
);

但是，只需从getInitialState方法返回它就可以了。

最初我设置了getInitialState（）来返回最初返回的数据（数组数组）。这没有用，因为ReactJS似乎想要一个对象而不是一个数组

只需将您的数据作为状态的一个方面：

getInitialState() {
  return {
    grid:  this.props.grid
  };
}

Answer 2

如果你正在使用ES2015 synax，你可以直接在构造函数中初始化状态：

constructor() {
  super();
  this.state = {...}
 }

什么是惯用的ReactJS处理方式？初始？州？

2 个答案: