为什么我应该在react-table中使用cell.render("Cell")而不是cell.value？

Question

我正在使用react-table包。cell.render("Cell")我很困惑，我能写下去还有什么意义cell.value？我在浏览器中看到它以相同的方式呈现。那么，为什么我应该使用第一个呢？

Answer 1

因为当您定义表的列时，您可能需要自定义单元格的呈现方式。这是我的专栏之一的示例。

{
        Header: "Enable",
        id: "enable",
        accessor: "enable",
        Cell: ({ value, row }) => (
            <FormCheck checked={value} onChange={(e) => handleCheckChange(row.index, e)} />
        ),
},

我使用 Cell 属性来自定义每个单元格在表格上的外观，但我无法像 onChange 那样向单元格添加道具。如果我只使用 .value 而不是 .render(Cell) 我的单元格将没有元素，并且我无法自定义值在单元格中的显示方式<td><FormCheck /><td/>

TLDR：如果您想根据列定义自定义单元格，您将需要使用 .render("Cell")。在我的代码示例中，我使用列选项单元格为该列插入复选框（仅影响标题 () ()）