Question

TypeError: headers.map 不是函数

function TableComponent(headers, values) {
  if (!headers || !values) return null;
  const optionsPerPage = [2, 3, 4];
  const [page, setPage] = useState(0);
  const [itemsPerPage, setItemsPerPage] = useState(optionsPerPage[0]);
  console.log(headers);
  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
      <DataTable>
        {headers.map(({ title, numeric }) => <DataTable.Title key={title} numeric={numeric}>{title}</DataTable.Title>)}
        {values.map((value, index) => <DataTable.Row key={index}>
        {headers.map(({ title }) => <DataTable.Cell key={title}>{value[title]}</DataTable.Cell>)}
        </DataTable.Row>)}
          <DataTable.Pagination
            page={page}
            numberOfPages={3}
            onPageChange={(page) => setPage(page)}
            label="1-2 of 6"
            optionsPerPage={optionsPerPage}
            itemsPerPage={itemsPerPage}
            setItemsPerPage={setItemsPerPage}
            showFastPagination
            optionsLabel={'Rows per page'}
          />
      </DataTable>
    </View>
  );
}

也许我对这个问题完全使用了错误的解决方案。如果这根本行不通，我愿意接受替代方案。

Answer 1

根据评论，看起来 headers 是一个对象而不是数组，这解释了“headers.map 不是函数”。而是使用 headers.headers.map(...)，因为 headers.headers 是一个数组。

有没有办法克服错误“TypeError: headers.map is not a function”？

1 个答案: