必须返回有效的 React 元素或 null -- Reactjs 错误

拜托，我遇到了一些对我来说很难修复的错误。我下面有一个简单的反应组件

import React from 'react';

const ForumPostComponent = (topics) => {
    const {forums} = topics;

    return (
            forums.toJS().map((forum, key) => {
                console.log(forum);
                    return ( 
                        <div className="post" key={key}>
                     )
                })


    )
}

在另一个组件中，我使用了我的 React forumComponent，例如 .

<ForumPostComponent forums={this.props.forums.get('forums')} />

它会抛出标题中的错误。另外，我在论坛组件中的控制台消息返回值。我尝试并阅读了许多类似的问题，但均无济于事。请问我到底缺少什么？

数组不是有效的反应元素，您需要用一些容器包装。例如。<div>:

return (
  <div>
    {forums.toJS().map((forum, key) => {
      console.log(forum);
      return ( 
        <div className="post" key={key} />
      )
    })}
  </div>
)

此外，使用数组索引作为元素键是一种不好的做法。您应该改用一些业务密钥。