javascript - Ag-Grid 外部过滤不响应状态变化

标签 javascript reactjs ag-grid

我一直在努力让 Ag-Grid 的外部过滤响应状态变化。当我更新 isExternalFilteredisExternalFiltered 的值在 doesExternalFilterPass回调不会改变。如果我向网格提供一个键来强制它重新呈现每个更新,它似乎可以工作,但它会导致昂贵的网格重新初始化。

我还要注意,我尝试调用网格 api 的 onFilterChanged过滤器更改时的方法,但这似乎没有任何效果。

文档似乎没有任何使用 React(或任何框架,就此而言)进行外部过滤的示例,所以我开始怀疑它是否不受支持?

    const Grid = () => {

        const [gridData, setGridData] = useState([]);
        const [columnDefs, setColumnDefs] = useState([]);
        const [isExternalFiltered, setExternalFiltered] = useState(false);

        /*
         Omitted for brevity
        */

        return (            
            <div className="ag-theme-material">
                <AgGridReact
                    // omitted for brevity
                    columnDefs={columnDefs}
                    rowData={gridData}
                    isExternalFilterPresent={() => true}
                    doesExternalFilterPass={node => {
                        return isExternalFiltered
                            ? filterFunction(node.data)
                            : true;
                    }}
                />
            </div>
        );
    };

最佳答案

有点晚了,但今天早上我遇到了类似的问题,我将发布我发现的内容,以帮助将来解决同样问题的人。发生这种情况是因为 ag-grid React 从不更新 isExternalFilterPresent 的回调。 .我通过将回调存储在一个变量中来确认这一点,导致网格重新呈现,然后检查回调中的 isExternalFilterPresent。从 gridApi 获得的 gridOptions 内部。这两个回调始终相同,这意味着您的回调 isExternalFilterPresent 的任何值, close over 永远不会更新。解决此问题的方法是对 isExternalFilterPresent 的任何值使用 ref。关闭,因此您始终可以访问最新的值。

关于javascript - Ag-Grid 外部过滤不响应状态变化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56430096/

相关文章:

javascript - 使用 JSON 将动态数组传递给 Morris Chart

javascript - React js - 测试组件时如何模拟上下文

reactjs - 如何将 chart.js 与 React Hook 一起使用?

javascript - 在 Reactjs 中读取 excel 文件

Ag-grid - 使用自定义单元格编辑器时是否会忽略值解析器?

javascript - jnlp 与 javascript 通信

javascript - 找不到模块 'winston'

javascript - Next.js 页面中的 ag-grid 渲染

ag-grid - 如何为 Angular 5 包含 ag-grid 样式?

javascript - "TypeError: db._checkNotDeleted is not a function"在 Firebase/React 上创建存储引用时