是否有一种方法可以禁止在react-data-grid中拖动单元格?

问题描述 投票:3回答:1

我正在使用react-data-grid制作可编辑表格。在react-data-grid中,似乎具有用于编辑单个单元格并将其与单元格句柄(类似于Excel)一起拖动(因此更新多个单元格)的功能。有没有一种方法可以让每个单元格进行编辑并禁用拖动功能?

handleGridRowsUpdated = ({ fromRow, toRow, updated }) => {
    let { rows } = this.state
    rows = rows.slice()

    for (let i = fromRow; i <= toRow; i += 1) {
        const rowToUpdate = rows[i]
        rows[i] = update(rowToUpdate, { $merge: updated })
    }

    this.setState({ rows })
}

rowGetter = (i) => {
    const { rows } = this.state
    return rows[i]
}

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

        return (
            <div className="table">
                <ReactDataGrid
                    enableCellSelect={true}
                    columns={columns}
                    rowGetter={this.rowGetter}
                    rowsCount={rows.length}
                    onGridRowsUpdated={this.handleGridRowsUpdated}
                    rowHeight={44}
                    minColumnWidth={100}
                />
            </div>
        )
}
reactjs react-data-grid
1个回答
0
投票

您可以使用CSS轻松隐藏拖动句柄:.drag-handle { display: none; }

看起来在网格属性上似乎有onCellsDraggedonDragHandleDoubleClick函数可以覆盖,但是我没有打扰,因为通过CSS隐藏它很容易。

© www.soinside.com 2019 - 2024. All rights reserved.