将变量传递给 n.setSelected 方法？

Question

我目前在一个页面上有 2 个 ag-grid 实例，通过右侧 table 的行选择然后导致在左侧 table 也选择了一行。

我的问题是我需要知道哪个 table（左或右）导致左 table 选择其他状态。

为了帮助理解，事件的顺序如下：

// set state globally and pass into both LeftGridWrapper and RightGridWrapper
// THIS STATE CONTROLS WHAT ROWS ARE SELECTED IN THE LEFT MENU
const [selectedIds, setSelectedIds] = useState([]);

return (
  <div>
    <LeftGridWrapper setSelectedIds={setSelectedIds}  selectedIds={selectedIds/>
    <RightGridWrapper setSelectedIds={setSelectedIds} />
  </div>
)

// In the RightGridWrapper
onRowSelected = (params) => {
  ...
  // causes selection in LeftGridWrapper
  setSelectedIds([...selectedIds, params.data.someId])
}

// In the LeftGridWrapper
useEffect(() => {
  leftGridOptionsApi.forEachNode(n => {
    if (selectedIds.includes(n.id) n.setSelected(true);
    else n.setSelected(false);
  }
}, [selectedIds])

所以基本上，我希望能够做这样的事情：n.setSelected(false, origin = 'LEFT') 然后在 onRowSelected 中检查 origin 是“左”还是“右”

Answer 1

假设您希望在从右侧网格中选择行时在左侧网格中使用不同颜色突出显示行。

我建议这样做：

右侧网格上的 onRowSelect 事件 -> 更新左侧网格 -> 首先选中 -> 然后将一个额外的参数更新为 true，这将让您确定它是从右侧网格中选择的

    onRowSelected = (params) => {
      ...
      // causes selection in LeftGridWrapper
      leftGridOptionsApi.forEachNode(n => {
        if (selectedIds.includes(n.id){
            n.setSelected(true); // directly set left grid row selected
            n.setDataValue('colKey', value); // update a column data to true that is 
 selectedFromRight
          }
    
      }
    }

现在在左侧网格 rowSelection 始终将 columnkey/parameter 更新为 false

在参数为真时为所选行添加自定义样式突出显示红色或黄色，所有这些假设您想要区分从何处选择行并执行某些操作因此。

如果解决方案适合您或者您有不同的要求，请告诉我。

将变量传递给 n.setSelected 方法？

Pass a variable to the n.setSelected method?

ag-grid

ag-grid-react