【问题标题】:react-window Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: objectreact-window 元素类型无效:期望字符串(用于内置组件)或类/函数(用于复合组件)但得到:对象
【发布时间】:2021-04-23 22:32:44
【问题描述】:

我正在使用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) =&gt; &lt;User user={user} key={user.__id} /&gt;);

我收到一个错误提示

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`.

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

我该如何解决这个问题?

【问题讨论】:

    标签: reactjs react-window


    【解决方案1】:

    您需要将组件作为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>
    

    【讨论】:

      猜你喜欢
      • 2022-08-15
      • 2018-02-19
      • 2020-05-09
      • 2019-04-02
      • 2020-07-13
      • 2021-10-25
      • 2021-06-07
      • 1970-01-01
      • 2019-09-06
      相关资源
      最近更新 更多