react-window 元素类型无效:需要一个字符串(对于内置组件)或一个 class/function(对于复合组件)但得到:对象

react-window Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object

我正在使用 react-window 来尝试生成列表。

使用他们使用的默认行,他们创建

const Row = ({ index, style }) => (
    <div className={index % 2 ? 'ListItemOdd' : 'ListItemEven'} style={style}>
        Row {index}
    </div>
);

然后他们使用默认元素像这样创建列表

  <List
    className="List"
    height={150}
    itemCount={1000}
    itemSize={35}
    width={300}
  >
    {Row}
  </List>

返回的也是一个对象,和我的一样构成

我正在尝试做大致相同的事情。

我正在使用列表组件

<List
      className="List"
      height={150}
      itemCount={20}
      itemSize={35}
      width={300}>
            {renderUsers(users)}
</List>

其中 renderUsers(users) 输出 const renderUsers = map((user) => <User user={user} key={user.__id} />);

我收到一条错误消息

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

Check the render method of `List`.

返回的是一个看起来像这样的对象(问题?)

我该如何解决这个问题?

您需要将组件作为 List 的子项传递,而不是元素列表。

const Row = ({ data, index, style }) => {
      const user = data.users[index];
        return (
          <div style={style}>
            <User user={user} key={user.__id} />
          </div>
       )
     };

<List
      className="List"
      height={150}
      itemCount={users.length}
      itemSize={35}
      itemData={{
         users,
      }}
      width={300}>
      {Row}
</List>