Question

我正在使用React-Bootstrap-Table-2并使用它们的rowEvents函数使行可单击以转到另一页。但是，我需要从该行事件中排除其中一列，因为它具有“状态”开关，并且onClick函数优先于该开关，因此我无法再切换它。

我尝试使用columnIndex，但是不确定如何将其从行事件中删除。示例：我有五列，我只希望该行事件跨越其中四列，而不是最后一列。

  const rowEvents = {
      onClick: (e, row, rowIndex) => {
        this.handleOfferSelection(row);
      },
      onMouseEnter: (e, row, rowIndex) => {
        this.setState({ activeRow: rowIndex });
      }
    };

// Table
    <BootstrapTable
                      {...props.baseProps}
                      pagination={paginationFactory()}
                      rowEvents={rowEvents}
                      rowStyle={rowStyle}
                    />

我只需要从行事件中完全排除最后一列。

Answer 1

onClick: (e, row, rowIndex) => {
    let getCurrentCellIndex = e.target.cellIndex;
    let getLastCellIndex = document.querySelector('table tr:last-child td:last-child').cellIndex
      // As this event is for the hole ROW, we need to exclude last one, as we have different events there. You can exclude no matter which one, even pass it as parameter.

      if (getCurrentCellIndex !== getLastCellIndex && getCurrentCellIndex !== undefined) {
        console.log(`----> ${JSON.stringify(row)} |||| ${rowIndex}`)
      }
}

排除行事件中的单列

1 个答案: