前端表格工具AG Grid 34.3 发布：重磅引入AI工具包，全面支持 React 19.2！
<p><img src="https://image.evget.com/attachment/keditor/image/20251029/094019_2.png"></p><p>近日，全球知名的前端表格工具AG Grid 发布最新版本 v34.3！本次更新带来了全新的AI工具包（AI Toolkit）、列宽自适应与数据透视增强功能，并正式支持React 19.2，助力开发者打造更智能、更高效的数据可视化体验。</p>
<p style="text-align: center"><strong><span style="color: rgba(230, 126, 35, 1)">AG Grid最新版试用，请联系AG Grid官方合作伙伴慧都科技</span></strong></p>
<h2>核心亮点一览</h2>
<ul>
<li>
<p><strong>AI Toolkit</strong> —— 基于大模型（LLM）的智能网格交互，让终端用户可通过自然语言操控表格状态。</p>
</li>
<li>
<p><strong>MCP Server</strong> —— 为 LLM 提供框架与版本级知识，让开发者更高效地集成与升级 AG Grid。</p>
</li>
<li>
<p><strong>Scaled Column Auto-Sizing</strong> —— 列宽自动缩放，自适应屏幕宽度，保持视觉整齐与数据可读性。</p>
</li>
<li>
<p><strong>Date & Time Pivoting</strong> —— 新增时间维度透视支持（按日、周、月、年），更便捷地进行时序分析。</p>
</li>
<li>
<p><strong>React 19.2 官方支持</strong> —— 全面兼容最新版本 React，性能与稳定性进一步提升。</p>
</li>
</ul>
<p>💡 <strong>本次为非破坏性更新</strong>：使用 AG Grid 33.x 的项目可直接升级至 34.3，无需修改代码。</p>
<hr>
<h2>AI Toolkit：让表格理解自然语言</h2>
<p>AG Grid 34.3 全新引入 <strong>AI Toolkit</strong>，可与任意大语言模型（LLM）集成，让用户直接用自然语言对表格进行查询和操作。</p>
<p>🔹 支持 ChatGPT、Gemini 等主流 LLM<br>🔹 自动生成 JSON Schema 格式的结构化输出<br>🔹 模型可直接返回符合 Schema 的结果，一步完成状态更新</p>
<p>示例代码：</p>
<div class="contain-inline-size rounded-2xl relative bg-token-sidebar-surface-primary">
<pre class="prettyprint highlighter-hljs"><code>// 获取表格状态结构
const gridSchema = gridApi.getStructuredSchema();
// 将用户请求、当前状态与 Schema 一并传入 LLM
const response = await callLLM(userRequest, gridApi.getState(), gridSchema);
// 更新表格状态
gridApi.setState(response.newGridState);</code></pre>
<span "="">借<span "="">助 AI Toolkit，用户可用自然语言轻松完成复杂操作，例如：“按销售额降序排列并只显示前10行”。</div>
<hr>
<h2>MCP Server：让 AI 理解 AG Grid</h2>
<p>全新的 <strong>MCP（Model Context Protocol）Server</strong>，为 AI 工具（如 Claude Code、ChatGPT Plugins 等）提供框架级知识。 开发者可通过以下命令快速接入：</p>
<div class="contain-inline-size rounded-2xl relative bg-token-sidebar-surface-primary">
<pre class="prettyprint lang-js highlighter-hljs"><code>claude mcp add ag-mcp npx ag-mcp</code></pre>
<span "="">安装完成后，AI 即可自动获取 AG Grid 的上下文信息，更准确地协助代码集成与版本维护。</div>
<hr>
<h2>Scaled Column Auto-Sizing：智能列宽自适应</h2>
<p>全新列宽自适应算法在常规自动计算基础上，<br>会根据可用空间 <strong>等比例放大列宽</strong>，确保整体布局紧凑、视觉平衡。</p>
<p>启用方式示例：</p>
<div class="contain-inline-size rounded-2xl relative bg-token-sidebar-surface-primary">
<pre class="prettyprint highlighter-hljs"><code>gridRef.current.api.autoSizeColumns({
skipHeader,
scaleUpToFitGridWidth
});</code></pre>
<span "="">非常适合动态生成列结构或未知数据宽度的场景。</div>
<hr>
<h2>📅 Date & Time Pivoting：时间维度透视分析</h2>
<p>Pivot 功能现已支持 <strong>日期与时间字段</strong>，可按“年/月/日”等层级进行分组汇总。</p>
<div class="contain-inline-size rounded-2xl relative bg-token-sidebar-surface-primary">
<pre class="prettyprint highlighter-hljs"><code>{ field: 'date', pivot: true, groupHierarchy: ['year', 'month']
}</code></pre>
<span "="">开发者可直接在表格中完成时序趋势分析，无需外部 BI 工具。</div>
<hr>
<h2>⚛️ React 19.2 官方支持</h2>
<p>AG Grid 团队已全面适配 <strong>React 19.2</strong>，并完成所有示例的兼容性验证。<br>开发者可立即使用新版 React 带来的性能与特性提升。</p>
<hr>
<h2>🧾 总结</h2>
<p>AG Grid 34.3 不仅强化了数据展示与操作体验，更引入了创新的 AI 能力，为前端数据交互打开全新可能。</p>
<p>🔹 AI Toolkit —— 让表格“懂你说的话”<br>🔹 MCP Server —— 让 AI “懂 AG Grid”<br>🔹 自适应列宽与时间透视 —— 提升可视化细节体验<br>🔹 React 19.2 支持 —— 最新生态无缝接轨</p>
<h3>📌 <strong>关于 AG Grid</strong></h3>
<p><strong>AG Grid </strong>是全球领先的 JavaScript 数据表格控件，广泛应用于金融、电信、制造等行业，支持 Angular、React、Vue 和纯 JavaScript 项目，拥有企业级的性能与功能深度。</p>
<p style="text-align: center"><strong><span style="color: rgba(230, 126, 35, 1)">AG Grid最新版试用，请联系AG Grid官方合作伙伴慧都科技</span></strong></p><br><br>
来源：https://www.cnblogs.com/software-Development/p/19173902
頁:
[1]