高性能表格组件AG Grid 35 全新发布：支持单元格公式、分组拖拽、绝对排序、列选择等
<p><img src="https://image.evget.com/attachment/keditor/image/20251211/140352_1.png"></p><p>作为全球知名的企业级数据网格控件，<strong>AG Grid</strong> 以强大的性能、灵活的 API 设计与成熟的企业组件生态而闻名，广泛应用于金融、制造、能源、电商等高数据密度行业。此次发布的 <strong>AG Grid 35</strong> 是一次重量级更新，带来了诸多提升用户交互体验与数据处理效率的全新特性，包括：单元格公式、行分组拖拽、绝对排序、列选择，以及全新的过滤与导出覆盖层。</p>
<p style="text-align: center"><span style="color: rgba(230, 126, 35, 1)"><strong>AG Grid最新版下载，请联系AG Grid中国区伙伴慧都科技</strong></span></p>
<p>以下为本次更新的重点内容解读。</p>
<hr>
<h2>⭐ <strong>关键更新一览</strong></h2>
<h3><strong>1. Formulas（单元格公式）</strong></h3>
<p><strong>AG Grid</strong> 35 支持在网格单元格内直接输入类似 Excel 的公式，用户可引用单元格、使用函数和运算符，自由生成自定义计算逻辑。</p>
<pre class="prettyprint lang-js highlighter-hljs"><code>// 启用公式
const getRowId = (params) => String(params.data.rid);
const columnDefs = [
{
field: 'subtotal',
allowFormula: true
},
];</code></pre>
<p>如内置函数无法满足需求，还可通过formulaFuncs自定义公式函数：</p>
<pre class="prettyprint lang-js highlighter-hljs"><code>const gridOptions = {
formulaFuncs: {
foo: {
func: (params) => {
return bar;
},
},
}
}</code></pre>
<p><strong><img src="https://image.evget.com/2025/12/11/screenshot_2025-12-11_14-28-49w5r807c2mvkftpqp.gif"><br></strong></p>
<p><strong>场景价值：</strong></p>
<p>无需开发改动，用户即可自行创建动态计算，在财务分析、统计计算、自定义指标等场景中尤为实用。</p>
<hr>
<h3><strong>2. Row Group Dragging（行分组拖拽）</strong></h3>
<p>行拖拽能力升级，可在分组内或跨分组拖动数据行，网格会自动处理对应的数据更新。</p>
<pre class="prettyprint lang-js highlighter-hljs"><code>const gridOptions = {
autoGroupColumnDef: { rowDrag: true, width: 250 },
suppressMoveWhenRowDragging: true,
refreshAfterGroupEdit: true,
rowDragManaged: true,
getRowId: ({ data }) => data.id,
};</code></pre>
<p><strong><img src="https://image.evget.com/2025/12/11/screenshot_2025-12-11_14-32-223cbu60mgl4hjwqu1.gif"><br></strong></p>
<p><strong>适用场景：</strong></p>
<p>财务报表条目调整、生产任务排序、区域账户归类等需要灵活组织数据的业务场景。</p>
<hr>
<h3><strong>3. Absolute Sorting（绝对排序）</strong></h3>
<p>绝对排序按数值“绝对值大小”进行排序，不区分正负。</p>
<pre class="prettyprint lang-js highlighter-hljs"><code>{
field: 'rankingChange',
sort: { direction: 'asc', type: 'absolute' },
sortingOrder: [
{ direction: 'asc', type: 'absolute' },
{ direction: 'desc', type: 'absolute' },
null,
],
}</code></pre>
<p><strong><img src="https://image.evget.com/2025/12/11/screenshot_2025-12-11_14-36-5866j040e0xt7zp2n8.gif"><br></strong></p>
<p><strong>适用场景：</strong></p>
<p>偏差、异常、误差、波动幅度等“大小比方向更重要”的排序需求。</p>
<hr>
<h3><strong>4. Column Selection（列选择）</strong></h3>
<p>用户可通过点击列头或按键操作，直接选择整列；同时支持 ctrl/shift 多列选择。</p>
<pre class="prettyprint lang-js highlighter-hljs"><code>const columnDefs = [
{
field: 'subtotal',
enableColumnSelection: true
},
];</code></pre>
<p><strong><img src="https://image.evget.com/2025/12/11/screenshot_2025-12-11_14-19-50fv9tjihorflftr6h.gif"><br></strong></p>
<p><strong>典型应用：</strong></p>
<p>批量数据操作、列级图表生成、快速分析等高频场景。</p>
<hr>
<h3><strong>5. Filtering & Export Overlays（过滤与导出覆盖层）</strong></h3>
<p>AG Grid 35 新增：</p>
<ul>
<li>
<p>无匹配数据覆盖层（过滤结果为空时展示）</p>
</li>
<li>
<p>导出中覆盖层（大数据量导出时提示）</p>
</li>
</ul>
<p>并支持自定义替换默认 Overlay：</p>
<pre class="prettyprint lang-js highlighter-hljs"><code>const gridOptions = {
components: {
agLoadingOverlay: CustomLoadingOverlay,
agNoRowsOverlay: CustomNoRowsOverlay,
agNoMatchingRowsOverlay: CustomNoMatchingRows,
agExportingOverlay: CustomExportingOverlay
},
}</code></pre>
<p><strong>价值：</strong></p>
<p>提升用户在操作大规模数据集时的体验反馈。</p>
<hr>
<h2><strong>总结</strong></h2>
<p><strong>AG Grid 35 是一次面向高交互、高分析型业务的重大增强版本，亮点包括：</strong></p>
<ul>
<li>
<p>✔ 单元格公式：让网格具备 Excel 级计算能力</p>
</li>
<li>
<p>✔ 行分组拖拽：提升分组数据的组织灵活性</p>
</li>
<li>
<p>✔ 绝对排序：更易发现偏差、波动与异常</p>
</li>
<li>
<p>✔ 列选择：加速批量数据处理</p>
</li>
<li>
<p>✔ 全新覆盖层：提供更清晰的用户反馈</p>
</li>
</ul>
<p style="text-align: center"><span style="color: rgba(230, 126, 35, 1)"><strong>AG Grid最新版下载，请联系AG Grid中国区伙伴慧都科技</strong></span></p><br><br>
来源：https://www.cnblogs.com/software-Development/p/19336794
頁:
[1]