反应| 为什么.map在.forEach创建"超出最大调用堆栈大小"错误时工作

Question

新的反应和玩弄它.看不出任何明显的原因我使用forEach时出现错误,使用map时没有错误:

注意:我使用的是&符号(基于骨干的框架)Repos = 30个对象,每个对象有3个属性

export default React.createClass({
  mixins: [ampersandReactMixin],
  displayName: 'ReposPage',
  render() {
    const {repos} = this.props

    return (
      <div>        
        {
          repos.forEach((repo) => {

            return (              
              <div key={repo.id}>
                <span>goodbye world</span>
              </div>
            )
          })
        } 
      </div>
    )
  }
});

输出:

Warning: Any use of a keyed object should be wrapped in React.addons.createFragment(object) before being passed as a child.
warning.js:48 Warning: Any use of a keyed object should be wrapped in React.addons.createFragment(object) before being passed as a child.
warning.js:48 Warning: Any use of a keyed object should be wrapped in React.addons.createFragment(object) before being passed as a child.
traverseAllChildren.js:67 
Uncaught RangeError: Maximum call stack size exceeded

VS

export default React.createClass({
  mixins: [ampersandReactMixin],
  displayName: 'ReposPage',
  render() {
    const {repos} = this.props

    return (
      <div>        
        {
          repos.map((repo) => {

            return (              
              <div key={repo.id}>
                <span>goodbye world</span>
              </div>
            )
          })
        } 
      </div>
    )
  }
});

哪个工作正常.

我认为它与地图返回一个新对象有关...为什么这到底有什么关系？

Answer 1

forEach 总是返回undefined.

所以,你的第一个例子基本上就是

<div>
  { undefined }
</div>

React正在窒息渲染未定义它出现.