AG-grid cell-Renderer 需要在按钮点击后重新渲染答案

【问题标题】：AG-grid cell-Renderer needs to re-render after button clickAG-grid cell-Renderer 需要在按钮点击后重新渲染
【发布时间】：2022-10-15 14:58:53
【问题描述】：

我在用AG网格在反应.

其中一列命名为 cellRenderer动作单元渲染.它包括三个pause、stop 和info 按钮。

单击按钮时如何更新按钮的图标？例如将pause 图标更改为play。

下面的代码显示了我的代码的最小化版本，它不起作用（由于不再渲染）

export default function ActionCellRenderer(props) {


  const onPlay = () => {
    props.node.setDataValue('status', 'running');
  };

  const onPause = () => {
    props.node.setDataValue('status', 'paused');
  };


  return(
    <span>
      {
        props.data.status === 'running' ? <FontAwesomeIcon icon={faPauseCircle} size="lg" className='rc_faPause'  onClick={onPause}/> :
          <FontAwesomeIcon icon={faPlayCircle} size="lg" className='rc_faPause'  onClick={onPlay}/>
      }
    </span>
  );
}

【问题讨论】：

标签： reactjs ag-grid

【解决方案1】：

问题已经解决了。只需在 cellRenderer 函数组件中定义props.data 为内部状态，如下：

const [rowData, setRowData] = useState(props.data);

【讨论】：