useRef在React的ag-grid中创建一个cellEditor

时间:2019-12-09 09:42:43

标签: reactjs ag-grid ag-grid-react

我对如何将React中的useRef Hook与ag-grid组件结合使用来创建持久的cellEditor有疑问。在下面的Github示例中,有一个示例,说明了用户在ag-grid中编辑字段后如何访问新值:


export default forwardRef((props, ref) => {
    const inputRef = useRef();
    useImperativeHandle(ref, () => {
        return {
            getValue: () => {
                return inputRef.current.value;
            }
        };
    });

    useEffect(() => {
        // https://github.com/facebook/react/issues/7835#issuecomment-395504863
        setTimeout(() => inputRef.current.focus(), 10)
    }, []);
    return <input type="text" ref={inputRef} defaultValue={props.value}/>;
})

我不了解的是如何找到我正在编辑的行和字段。有人可以指出我想念的东西吗?

1 个答案:

答案 0 :(得分:1)

网格刷新API提供了用于处理单元的界面。道具参数拥有您所需的一切。

https://www.ag-grid.com/javascript-grid-refresh/#refresh-cells

interface RefreshCellsParams {
    rowNodes?: RowNode[]; // specify rows, or all rows by default
    columns?: (string|Column)[]; // specify columns, or all columns by default
    force?: boolean; // skips change detection, refresh everything
}