javascript devexpress React Grid table colspan

68bkxrlz 于 2023-06-04 发布在 Java

关注(0)|答案(1)|浏览(137)

我正在使用dex devexpress React Grid。我想合并第一行中的单元格，同时保持其他行不变。

const Cell = props => {
  const { tableColumn } = props;
  if (tableColumn.column.name === "name") {
    return <Table.Cell {...props} colSpan={4} />;
  }
  return null;
};

render() {
    const { rows, columns } = this.state;

    return (
      <Grid rows={rows} columns={columns}>
        <Table cellComponent={Cell} />
        <TableHeaderRow />
      </Grid>
    );
  }

这是demo https://codesandbox.io/s/devextreme-react-grid-for-bootstrap-4-l8w39

JavaScript

来源：https://stackoverflow.com/questions/76395382/devexpress-react-grid-table-colspan

1条答案

按热度按时间

6rqinv9w1#

如果你只想修改第一行，你需要像下面这样检查tableRow属性：

const Cell = (props) => {
  const { column, tableRow, value } = props;
  console.log(props);
  if (tableRow.rowId === 0) {
    if (column.name === "name") {
      return (
        <Table.Cell {...props} colSpan={4}>
          <div
            style={{
              textAlign: "center",
              border: "1px solid red",
              width: "100%"
            }}
          >
            {value}
          </div>
        </Table.Cell>
      );
    } else {
      return null;
    }
  }
  return <Table.Cell {...props} />;
};

The sandbox

赞(0）回复(0）举报 2023-06-04

我来回答

javascript devexpress React Grid table colspan

1条答案

相关问题

热门标签

最新问答