From 03eab7ab670e4fcc077911be9ff957d0ef4cd11b Mon Sep 17 00:00:00 2001
From: HIsheR <shawn1440982358@163.com>
Date: Mon, 26 Oct 2026 13:13:08 +0800
Subject: [PATCH] =?UTF-8?q?iter(g94):=20=E8=A1=A5=E5=85=85=E6=95=B0?=
 =?UTF-8?q?=E6=8D=AE=E8=A1=A8=E8=81=94=E5=8A=A8=E5=AF=BC=E5=87=BA=E9=85=8D?=
 =?UTF-8?q?=E6=96=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .ua/backlog.json              |  8 ++++++++
 llms-full.txt                 | 24 ++++++++++++++++++++++++
 packages/tools/cli/recipes.md | 24 ++++++++++++++++++++++++
 3 files changed, 56 insertions(+)

diff --git a/.ua/backlog.json b/.ua/backlog.json
index f19c2ad..163820b 100644
--- a/.ua/backlog.json
+++ b/.ua/backlog.json
@@ -1108,6 +1108,14 @@
       "acceptance": "TreeProps 新增 searchable：顶部搜索框按标签包含匹配（大小写不敏感），命中节点连同父链保留、命中枝临时强制展开，不命中整枝隐藏且不参与 ↑↓ 遍历（visibleRows 改判 [hidden]）；搜索框放在 role=tree 之外避免语义混淆；文档与演示同步；tree ≤ 200 行；npm run check 全绿",
       "notes": "自补：可用性；搜索只改视图显隐，不回写 expanded 信号，退出搜索即恢复用户原有展开态",
       "status": "done"
+    },
+    {
+      "id": "g94",
+      "title": "补充数据表联动导出配方",
+      "motivation": "本轮新增的受控 page 联动、列宽拖拽、CSV 导出三个能力只有单组件参数表，没有「怎么拼在一起」的指导；配方文件停在第 4 条，Agent 与新人拼表格联动时仍要自己试",
+      "acceptance": "recipes.md 新增「配方 5：数据表 + 独立分页器 + 导出」，覆盖同一 page 信号双绑、exportable 导全量行与当页的区别、拖拽只对数字列宽生效、rowKey 记账；npm run docs 后 llms-full.txt 出现该配方；npm run check 全绿",
+      "notes": "自补：文档完善；只写用法不碰实现，配方随 docs 注入 llms-full",
+      "status": "open"
     }
   ]
 }
diff --git a/llms-full.txt b/llms-full.txt
index b098aab..b9f467a 100644
--- a/llms-full.txt
+++ b/llms-full.txt
@@ -1833,6 +1833,30 @@ list({ items: items(), bordered: true, emptyText: loading() ? '加载中…' : '
 - 空态文案随加载态切换；列表本身会在 `items` 为空时渲染 `empty`，不需要业务层再判断一次。
 - 需要骨架屏就换成 `skeleton`，加载完成再 `renderList` 成真实行。
 
+## 配方 5：数据表 + 独立分页器 + 导出
+
+```ts
+const page = signal(1);
+const table = dataTable({
+  data: rows,
+  columns: [
+    { key: 'name', header: '姓名', sortable: true, width: 160 },
+    { key: 'city', header: '城市', align: 'center', width: 'flex' },
+  ],
+  page,                        // 受控页码：与外部 pagination 双向联动
+  selectable: true,
+  exportable: true,            // 导出筛选 + 排序后的全量行（不是当前页）
+  exportName: '用户列表.csv',
+});
+const pager = pagination({ page, pageSize: 5, total: rows.length, jumpable: true, pageSizes: [5, 10, 20] });
+```
+
+要点：
+- 页码只保留一个来源：`dataTable` 与 `pagination` 共传同一个 `page` 信号，翻页由内核写回，桥接层会钳制越界值。
+- `exportable` 导出的是「筛选 + 排序后、未分页」的全量行，列序与表头一致、单元格走 `format`；想导出当前页请自行读 `getVisibleRows()`。
+- 列宽拖拽只对 `width` 给数字的列生效（`'flex'` 列交给浏览器自适应）；双击手柄回到声明宽度。
+- 行选择一律按 rowKey 记账，筛选换掉可见行后已选仍在，批量操作前用已选计数确认。
+
 ## 通用约定
 
 - 状态一律放信号（`signal` / `computed`），组件只读写信号，不持有业务数据副本。
diff --git a/packages/tools/cli/recipes.md b/packages/tools/cli/recipes.md
index 5381ccd..63ce81a 100644
--- a/packages/tools/cli/recipes.md
+++ b/packages/tools/cli/recipes.md
@@ -73,6 +73,30 @@ list({ items: items(), bordered: true, emptyText: loading() ? '加载中…' : '
 - 空态文案随加载态切换；列表本身会在 `items` 为空时渲染 `empty`，不需要业务层再判断一次。
 - 需要骨架屏就换成 `skeleton`，加载完成再 `renderList` 成真实行。
 
+## 配方 5：数据表 + 独立分页器 + 导出
+
+```ts
+const page = signal(1);
+const table = dataTable({
+  data: rows,
+  columns: [
+    { key: 'name', header: '姓名', sortable: true, width: 160 },
+    { key: 'city', header: '城市', align: 'center', width: 'flex' },
+  ],
+  page,                        // 受控页码：与外部 pagination 双向联动
+  selectable: true,
+  exportable: true,            // 导出筛选 + 排序后的全量行（不是当前页）
+  exportName: '用户列表.csv',
+});
+const pager = pagination({ page, pageSize: 5, total: rows.length, jumpable: true, pageSizes: [5, 10, 20] });
+```
+
+要点：
+- 页码只保留一个来源：`dataTable` 与 `pagination` 共传同一个 `page` 信号，翻页由内核写回，桥接层会钳制越界值。
+- `exportable` 导出的是「筛选 + 排序后、未分页」的全量行，列序与表头一致、单元格走 `format`；想导出当前页请自行读 `getVisibleRows()`。
+- 列宽拖拽只对 `width` 给数字的列生效（`'flex'` 列交给浏览器自适应）；双击手柄回到声明宽度。
+- 行选择一律按 rowKey 记账，筛选换掉可见行后已选仍在，批量操作前用已选计数确认。
+
 ## 通用约定
 
 - 状态一律放信号（`signal` / `computed`），组件只读写信号，不持有业务数据副本。