openyida 2026.5.21 → 2026.5.25

package/yida-skills/skills/yida-custom-page/examples/attachment-upload.js

@@ -110,6 +110,7 @@ export function uploadSingleAttachment(file) {
 }
 
 export function handleAttachmentChange(e) {
+  var self = this;
   var files = Array.prototype.slice.call(e.target.files || []);
   if (!files.length) {
     return;
@@ -117,17 +118,17 @@ export function handleAttachmentChange(e) {
 
   this.setCustomState({ uploading: true });
 
-  Promise.all(files.map(function(file) {
-    return this.uploadSingleAttachment(file);
-  }.bind(this))).then(function(uploaded) {
+  Promise.all(files.map((file) => {
+    return self.uploadSingleAttachment(file);
+  })).then(function(uploaded) {
     var next = (_customState.attachments || []).concat(uploaded);
-    this.setCustomState({ attachments: next, uploading: false });
-    this.utils.toast({ title: '附件上传成功', type: 'success' });
-  }.bind(this)).catch(function(error) {
+    self.setCustomState({ attachments: next, uploading: false });
+    self.utils.toast({ title: '附件上传成功', type: 'success' });
+  }).catch(function(error) {
     var message = error && error.message ? error.message : '附件上传失败';
-    this.setCustomState({ uploading: false });
-    this.utils.toast({ title: message, type: 'error' });
-  }.bind(this));
+    self.setCustomState({ uploading: false });
+    self.utils.toast({ title: message, type: 'error' });
+  });
 }
 
 export function removeAttachment(fileUuid) {
@@ -190,6 +191,7 @@ var styles = {
 
 export function renderJsx() {
   var state = this.getCustomState();
+  var self = this;
 
   return (
     <div style={styles.page}>
@@ -202,7 +204,7 @@ export function renderJsx() {
           multiple={true}
           style={{ display: 'none' }}
           disabled={state.uploading}
-          onChange={(e) => { this.handleAttachmentChange(e); }}
+          onChange={(e) => { self.handleAttachmentChange(e); }}
         />
       </label>
 
@@ -210,13 +212,13 @@ export function renderJsx() {
         return (
           <div key={item.fileUuid} style={styles.item}>
             <span>{item.name}</span>
-            <button style={styles.btn} onClick={(e) => { this.removeAttachment(item.fileUuid); }}>删除</button>
+            <button style={styles.btn} onClick={(e) => { self.removeAttachment(item.fileUuid); }}>删除</button>
           </div>
         );
       })}
 
       <div style={{ marginTop: '16px' }}>
-        <button style={styles.btn} onClick={(e) => { this.submitForm(); }}>提交</button>
+        <button style={styles.btn} onClick={(e) => { self.submitForm(); }}>提交</button>
       </div>
     </div>
   );

package/yida-skills/skills/yida-custom-page/references/attachment-upload-guide.md

@@ -380,13 +380,15 @@ export function submitForm() {
 配套渲染片段：
 
 ```jsx
+var self = this;
+
 <label>
   选择附件
   <input
     type="file"
     multiple={true}
     style={{ display: 'none' }}
-    onChange={(e) => { this.handleAttachmentChange(e); }}
+    onChange={(e) => { self.handleAttachmentChange(e); }}
   />
 </label>
 ```

package/yida-skills/skills/yida-custom-page/references/coding-guide.md

@@ -13,8 +13,10 @@
 | **三方包引入** | 禁止使用 `import/require` 语法，如需使用第三方库，必须通过 `this.utils.loadScript` 加载 CDN 脚本，参考 [yida-api.md](../../../references/yida-api.md) 的「工具类 API」章节。Tailwind 属于默认视觉层，按下方「Tailwind 引入规范」处理 |
 | **内置 lodash** | 宜搭页面运行时已全局加载 **lodash 4.6.1**（`window._`），可直接使用 `_.get`、`_.groupBy`、`_.cloneDeep` 等，无需 `loadScript`。详见下方「内置 lodash 使用指引」 |
 | **函数导出格式** | 原生写法使用 `export function xxx() {}`；现代 authoring 写法使用 `export default function Page()`，由 OpenYida 编译为原生导出函数 |
+| **生命周期名称** | 只允许 `didMount` / `didUnmount`，大小写敏感；不要写 `didmount`、`componentDidMount`、`componentWillUnmount` |
 | **样式** | 默认使用 Tailwind utility `className` 组织视觉层；关键尺寸、容器兜底和 Tailwind 加载失败兜底可继续使用 `style` 对象。禁止 `import` CSS、CSS Modules 或构建期样式能力 |
 | **`this` 上下文** | 所有导出函数中的 `this` 指向宜搭页面的 React 类实例 |
+| **按钮交互** | 可见 `<button>` 必须有 `onClick`/`onMouseDown`/`onKeyDown` 或明确 `disabled`；静态标签、状态徽标、截图标记用 `span`/`div` |
 | **禁止使用 `this.setState` 管理业务状态** | `this.setState` 已被覆盖，仅用于 `forceUpdate`（通过更新 `timestamp`） |
 | **JavaScript 版本** | 使用 ES2015 (ES6) 语法，不能高于 ES2015 版本。**注意**：即使是 ES6 语法，部分特性也会导致静默失败，详见下方「JS 引擎兼容性限制」 |
 | **必须定义页面入口** | 原生写法必须定义 `renderJsx`；`.oyd.jsx` authoring 写法必须定义 `export default function Page()` |
@@ -228,6 +230,8 @@ this.setCustomState(nextState);
 - didUnmount 函数
 - renderJsx 函数
 
+OpenYida 编译器会在发布前为极简页面补齐缺失的空 `didMount` / `didUnmount` 和基础状态函数，避免 Schema 中 actionRef 找不到函数；但交付给 AI/IDE 的源码仍必须按下面结构生成，便于人审、二次修改和 `check-page` 精准定位问题。
+
 ```jsx
 // ── 状态管理 ──────────────────────────────────────────
 var _customState = {

package/yida-skills/skills/yida-custom-page/references/component-jsx-guide.md

@@ -1,6 +1,6 @@
 # 自定义页面 JSX 组件指南
 
-> 适用于宜搭自定义页面运行时：React 16、类组件绑定、无 `import/require`、通过 `this.utils.yida.*` 调用数据 API。
+> 适用于宜搭自定义页面运行时：React 16、宜搭原生 `export function` 页面模式、无 `import/require`、通过 `this.utils.yida.*` 调用数据 API。
 
 ## 先说清楚边界
 
@@ -21,25 +21,26 @@
 
 ```javascript
 export function setDraftField(key, value) {
-  this._customState = this._customState || {};
-  this._customState.draft = this._customState.draft || {};
-  this._customState.draft[key] = value;
+  _customState.draft = _customState.draft || {};
+  _customState.draft[key] = value;
 }
 ```
 
 带输入法组合输入的文本输入：
 
 ```jsx
+var self = this;
+
 <input
-  defaultValue={this._customState.keyword || ''}
-  onCompositionStart={() => { this._isComposing = true; }}
+  defaultValue={_customState.keyword || ''}
+  onCompositionStart={(e) => { self._isComposing = true; }}
   onCompositionEnd={(e) => {
-    this._isComposing = false;
-    this._customState.keyword = e.target.value;
+    self._isComposing = false;
+    _customState.keyword = e.target.value;
   }}
   onChange={(e) => {
-    if (this._isComposing) { return; }
-    this._customState.keyword = e.target.value;
+    if (self._isComposing) { return; }
+    _customState.keyword = e.target.value;
   }}
   style={styles.input}
 />
@@ -48,17 +49,19 @@ export function setDraftField(key, value) {
 ## TextField / TextareaField
 
 ```jsx
+var self = this;
+
 <input
   defaultValue={(record.formData && record.formData[FIELDS.name]) || ''}
   placeholder="请输入"
-  onChange={(e) => { this.setDraftField(FIELDS.name, e.target.value); }}
+  onChange={(e) => { self.setDraftField(FIELDS.name, e.target.value); }}
   style={styles.input}
 />
 
 <textarea
   defaultValue={(record.formData && record.formData[FIELDS.remark]) || ''}
   placeholder="请输入备注"
-  onChange={(e) => { this.setDraftField(FIELDS.remark, e.target.value); }}
+  onChange={(e) => { self.setDraftField(FIELDS.remark, e.target.value); }}
   style={styles.textarea}
 />
 ```
@@ -216,16 +219,18 @@ var styles = {
 ```javascript
 export function dateInputToTimestamp(value) {
   if (!value) { return ''; }
-  const timestamp = new Date(`${value}T00:00:00`).getTime();
-  return Number.isNaN(timestamp) ? '' : timestamp;
+  var timestamp = new Date(value + 'T00:00:00').getTime();
+  return isNaN(timestamp) ? '' : timestamp;
 }
 ```
 
 ```jsx
+var self = this;
+
 <input
   type="date"
-  defaultValue={this.formatDateInput(record.formData && record.formData[FIELDS.planDate])}
-  onChange={(e) => { this.setDraftField(FIELDS.planDate, this.dateInputToTimestamp(e.target.value)); }}
+  defaultValue={self.formatDateInput(record.formData && record.formData[FIELDS.planDate])}
+  onChange={(e) => { self.setDraftField(FIELDS.planDate, self.dateInputToTimestamp(e.target.value)); }}
   style={styles.input}
 />
 ```
@@ -235,12 +240,14 @@ export function dateInputToTimestamp(value) {
 保持空值为空字符串；有值时再转数字，避免把未填项误写成 `0`。
 
 ```jsx
+var self = this;
+
 <input
   type="number"
   defaultValue={(record.formData && record.formData[FIELDS.amount]) || ''}
   onChange={(e) => {
-    const raw = e.target.value;
-    this.setDraftField(FIELDS.amount, raw === '' ? '' : Number(raw));
+    var raw = e.target.value;
+    self.setDraftField(FIELDS.amount, raw === '' ? '' : Number(raw));
   }}
   style={styles.input}
 />
@@ -312,19 +319,21 @@ export function dateInputToTimestamp(value) {
 筛选栏建议由关键词、状态、日期范围和按钮组成；点击查询时统一读取 `_customState.filters`，再调用 `this.utils.yida.searchFormDatas`。
 
 ```jsx
+var self = this;
+
 <div style={styles.filterBar}>
   <input
-    defaultValue={(this._customState.filters && this._customState.filters.keyword) || ''}
+    defaultValue={(_customState.filters && _customState.filters.keyword) || ''}
     placeholder="搜索关键词"
     onChange={(e) => {
-      this._customState.filters = this._customState.filters || {};
-      this._customState.filters.keyword = e.target.value;
+      _customState.filters = _customState.filters || {};
+      _customState.filters.keyword = e.target.value;
     }}
     style={styles.input}
   />
   <button
     type="button"
-    onClick={() => { this.loadRecords({ page: 1 }); }}
+    onClick={(e) => { self.loadRecords({ page: 1 }); }}
     style={styles.primaryButton}
   >
     查询

package/yida-skills/skills/yida-dashboard/SKILL.md

@@ -54,7 +54,7 @@ metadata:
 2. **真实数据接入**：KPI 走 `getDataAsync.json`，明细走 `searchFormDatas`，禁止前端聚合
 3. **视觉主题选型**：深色紫蓝科技风 / 金蓝奢华风 / 白底商务风（见 `references/theme-presets.md`）
 4. **每元素可派单闭环**：任何 KPI/图表/风险/动作项都能一键触发看板「派单触发表」的 saveFormData，由预先配置好的集成自动化自动调用「待办2.0 / 创建待办任务」连接器生成真实钉钉待办。前端只管写表，鉴权和连接器调用全部交给集成自动化在后端托管。不得把「工作通知」包装成待办（见 `references/interaction-patterns.md`）
-5. **卡片截图分享**：html2canvas 1.4.1，每个核心卡片右上角有"截图"按钮
+5. **卡片截图分享**：html2canvas 1.4.1，每个核心卡片右上角有可点击"截图"按钮，必须绑定 `onClick` 调用 `captureCard`；如果只是视觉标记或演示标签，用 `span/div`，不要写成无事件 `<button>`
 6. **多端响应**：PC 三列 / 平板两列 / 手机一列，断点 768 / 1024
 7. **组织内短链 + 隐藏导航**：发布后配置 `isRenderNav=false` + 组织内分享 URL
 8. **AI 快讯 marquee**（可选）：底部滚动字幕展示最新动态
@@ -70,9 +70,9 @@ metadata:
    - 有原生报表 → 记录 REPORT-xxx + 提取 cid/componentClassName
    - 没有原生报表 → 先调用 yida-report 技能创建数据源
    - 需要派单闭环 → **固定双件套**：
-       (a) 用 `yida-create-form-page` 建一张「看板派单触发表」（TodoTrigger），最少 5 个字段：
+       (a) 用 `yida-create-form-page` 建一张「看板派单触发表」（TodoTrigger），最少 6 个字段：
             subject(TextField) / executor(EmployeeField) / description(TextareaField) /
-            dueTime(DateField) / priority(RadioField 10/20/30/40 固定值)
+            dueTime(DateField) / priority(SelectField 展示审计) / priorityNum(NumberField 透传 10/20/30/40)
        (b) 用 `openyida integration create <appType> <formUuid> "<看板名>-派单" --events create
             --connector-id G-CONN-1016B8AEBED50B01B8D00009
             --action-id G-ACT-1016B8B1911A0B01B8D0000I
@@ -82,7 +82,7 @@ metadata:
             --connector-assignment creatorId:processVar:form_inst_modifier
             --connector-assignment description:processVar:<description字段ID>
             --connector-assignment dueTime:processVar:<dueTime字段ID>
-            --connector-assignment priority:literal:10         // ⚠ 必须 literal 数字
+            --connector-assignment priority:processVar:<priorityNum字段ID>  // ⚠ 必须 NumberField，禁止透传 SelectField/RadioField
             --connector-assignment executorIds:processVar:<executor字段ID>
             --publish` 一键生成并发布
    - 需要审计台账 → 可以复用上面这张「派单触发表」，它本身就是最小审计表；也可以再加一张独立审计表记录 dingTodoId 回写
@@ -124,9 +124,9 @@ metadata:
 6. **禁止把「工作通知」当作钉钉待办**：集成自动化里不允许只配「发送钉钉工作通知」节点就声称已打通待办；派单链路必须有一个 **ConnectorCall 节点**调用「待办2.0 / 创建待办任务」连接器。工作通知只能作为降级提醒，交付时必须写明"非真实待办"
 7. **禁止在看板内直接 fetch 钉钉 OpenAPI 或写 accessToken**：必须通过集成自动化后端托管连接器鉴权
 8. **禁止 cdnjs.cloudflare.com**：宜搭环境被拦截，ECharts / html2canvas 统一用 `g.alicdn.com`
-9. **禁止缺少 `.sl-no-capture` 标记**：截图时"截图"按钮本身要被 html2canvas 排除
+9. **禁止缺少 `.sl-no-capture` 标记或写无事件截图按钮**：截图按钮本身要被 html2canvas 排除，且必须有真实 `onClick`；静态状态胶囊、筛选展示项、截图占位标签一律用 `span/div`
 10. **禁止 2300 行一口气写到单个 create_file**：超过 1000 行用 `large-file-write` 技能或分批 append
-11. **禁止集成自动化 priority 入参用 processVar 透传 RadioField/SelectField 的选项值**：连接器要求 Number(10/20/30/40)，必须 `priority:literal:10` 字面量赋值，否则执行记录会报"一方连接器异常：接口参数异常"
+11. **禁止集成自动化 priority 入参用 processVar 透传 RadioField/SelectField 的选项值**：连接器要求 Number(10/20/30/40)，正常方案必须 `priority:processVar:<priorityNum NumberField 字段 ID>`；`literal:10` 只能作为临时回滚止血方案，否则 UI 优先级选项会失效
 
 ---
 
@@ -136,12 +136,13 @@ metadata:
    - `project/pages/src/supply-chain-dashboard.js`（深色紫蓝标杆，2356 行）
    - `project/pages/src/shangri-la-executive-dashboard.js`（金蓝奢华样本，1796 行）
    - 读取关键段学结构，不要凭空设计
-2. **审计表单字段 ID 在 FORM_CONFIG 常量集中声明**，便于一次性替换；`FORM_CONFIG.todoTrigger` 必须标注出 subject/executor/description/dueTime/priority 5 个字段 ID 与集成自动化 `--connector-assignment` 的映射完全一致
+2. **审计表单字段 ID 在 FORM_CONFIG 常量集中声明**，便于一次性替换；`FORM_CONFIG.todoTrigger` 必须标注出 subject/executor/description/dueTime/priority/priorityNum 6 个字段 ID 与集成自动化 `--connector-assignment` 的映射完全一致
 3. **前端派单统一走 `self.utils.yida.saveFormData`** 写入派单触发表，禁止引用已不存在的 `this.dataSourceMap.createDingTodo`。没有配置集成自动化时前端要 toast "派单触发表未配置集成自动化"，不要静默降级
 4. **每次数据请求必写 catch + 降级渲染**，不要静默失败
 5. **发布前用 `openyida check-page` 跑一次规范扫描**
 6. **首次发布必带 `--health-check`** 做首屏 HTTP 健康检查
 7. **交付物验收必须包含组织内短链 URL**，纯 aliwork.com 链接不算交付
+8. **所有可见 `<button>` 必须可用**：每个 button 要么有真实 `onClick/onMouseDown/onKeyDown`，要么显式 `disabled`；`openyida check-page` 不能出现 `button-missing-handler`
 
 ---
 
@@ -194,14 +195,14 @@ metadata:
 
 核对五件事（按优先级）：
 1. 派单触发表是否挂了集成自动化：`openyida integration list <appType>` / 或直接去设计器看流程状态 `y`
-2. 集成自动化执行记录是否有"执行异常 / 一方连接器异常：接口参数异常"：若是 → **95% 是 priority 没用 literal**，必须 `--connector-assignment priority:literal:10`（10=较低/20=普通/30=较高/40=最高）
+2. 集成自动化执行记录是否有"执行异常 / 一方连接器异常：接口参数异常"：若是 → **优先检查 priority 是否透传了 SelectField/RadioField 字符串**，必须改为 `--connector-assignment priority:processVar:<priorityNum NumberField 字段 ID>`；前端要同时写入展示字段 `priority` 和数字字段 `priorityNum`
 3. `FORM_CONFIG.todoTrigger.fields` 的字段 ID 是否与集成自动化 `--connector-assignment <column>:processVar:<字段ID>` 完全一致
 4. EmployeeField 在 saveFormData 里是否传成 `[String(userId)]` 数组（连接器会从数组自动取 unionId）
 5. 钉钉应用 / 宜搭版本是否具备「待办2.0」连接器权限；无权限须向用户说明只能降级为工作通知
 
 **Q：卡片截图里把"截图"按钮也拍进去了？**
 
-给截图按钮加 class `sl-no-capture`，并在 `html2canvas` 调用时传 `ignoreElements: el => el.classList.contains('sl-no-capture')`。
+给截图按钮加 class `sl-no-capture`，按钮本身还必须绑定 `onClick={function(e){ e.stopPropagation(); self.captureCard(...); }}`；并在 `html2canvas` 调用时传 `ignoreElements: function(el) { return el.classList && el.classList.contains('sl-no-capture'); }`。
 
 **Q：看板要支持 3 个品牌/产品线/BU 切换视图，怎么做？**
 

package/yida-skills/skills/yida-dashboard/references/interaction-patterns.md

@@ -575,6 +575,8 @@ export function captureCard(domId, fileName) {
 
 ### 3.3 截图按钮渲染组件
 
+截图控件是一个真实可点击按钮，不能只因为要加 `.sl-no-capture` 就写成静态 `<button>`。所有可见 `<button>` 必须绑定真实事件；如果只是展示"截图"状态、演示占位或不需要点击的标签，用 `span/div`。
+
 ```javascript
 var renderCaptureButton = function(self, domId, fileName, s) {
   return (

package/yida-skills/skills/yida-dashboard/references/pitfalls.md

@@ -197,11 +197,19 @@ fetch('/dingtalk/web/' + appType + '/.../saveFormData.json');
 
 **现象**：用户分享到群里，截图右上角赫然一个"截图"按钮。
 
-**正确做法**：给截图按钮加标记 class，传 `ignoreElements`：
+**正确做法**：截图按钮要同时满足两件事：有真实 `onClick`，并带 `sl-no-capture` 让 html2canvas 排除。如果只是视觉标签或占位，不要用 `<button>`，改用 `span/div`。
 
 ```javascript
-// 按钮加 class
-<button className="sl-no-capture" onClick={() => captureCard('chart-region')}>📷 截图</button>
+// 按钮加 class，且必须有真实点击事件
+<button
+  className="sl-no-capture"
+  onClick={function(e) {
+    e.stopPropagation();
+    self.captureCard('chart-region', '区域营收');
+  }}
+>
+  截图
+</button>
 
 // 截图时排除
 window.html2canvas(el, {
@@ -505,7 +513,8 @@ self.utils.toast({ title: '已创建待办', type: 'success' });
 - [ ] 派单 toast 文案是"派单已发起，将在 30 秒内收到钉钉待办"，**不是**"已创建待办"
 - [ ] 页面源码没有直接 `fetch` 钉钉 OpenAPI 或保存 accessToken/appSecret
 - [ ] ECharts / html2canvas 用 `g.alicdn.com`
-- [ ] 截图按钮有 `sl-no-capture` class + `ignoreElements` 已配
+- [ ] 截图按钮有真实 `onClick` + `sl-no-capture` class + `ignoreElements` 已配
+- [ ] 所有可见 `<button>` 都有真实事件或显式 `disabled`，静态标签/状态胶囊不用 button
 - [ ] 超过 1000 行用分批写入
 - [ ] 每个 `renderJsx` 的 return 分支都有 `timestamp` 隐藏 div
 - [ ] 纯工具函数用 `var`，组件方法用 `export function`

package/yida-skills/skills/yida-dashboard/references/structure-and-layout.md

@@ -337,6 +337,6 @@ var KPI_CARDS = [
 - [ ] 筛选任意维度，6 图表和 5 KPI 都实时刷新（不闪烁）
 - [ ] 每个 KPI / 模块 / 动作 / 风险点击都能弹出派单弹窗
 - [ ] 派单后钉钉客户端出现真实待办；不是仅收到工作通知（见 `interaction-patterns.md` 联调步骤）
-- [ ] 每个卡片右上角"截图"按钮可用，截出来不包含按钮本身
+- [ ] 每个卡片右上角"截图"按钮可用，有真实 `onClick`，截出来不包含按钮本身
 - [ ] marquee 在底部平滑滚动不卡顿
 - [ ] 组织内短链打开 → 无平台导航 → 看板顶满一屏

package/yida-skills/skills/yida-ppt-slider/SKILL.md

@@ -7,21 +7,23 @@ description: "宜搭自定义页面 PPT 幻灯片开发指南。用于在宜搭
 
 ## 严格禁止 (NEVER DO)
 
-- 不要使用 React Hooks（`useState`、`useEffect`），必须使用类组件模式
-- 不要在 `renderJsx` 内部创建内联事件处理函数，必须在顶部定义后引用
+- 不要使用 React Hooks（`useState`、`useEffect`），必须使用宜搭原生 `export function` + `_customState` 模式
+- 不要写会在渲染期执行或无效的事件绑定：禁止 `onClick={foo()}`、`onClick={handleDotClick(i)}`、`onClick={(e) => self.foo}`；推荐在 `renderJsx` 顶部定义 handler 后引用，传参用 `data-*` 或函数包装调用
 - 不要使用 `import/require` 引入第三方库，必须通过 CDN 或内联代码
-- 不要在 `componentWillUnmount` 中遗漏清理键盘/触摸事件监听，否则内存泄漏
+- 不要在 `didUnmount` 中遗漏清理键盘/触摸事件监听，否则内存泄漏
 - 不要使用 `objectFit: 'cover'` 裁剪图片，必须用 `contain` 确保完整显示
 - 不要将幻灯片数据硬编码在 `renderJsx` 中，必须定义为顶层 `SLIDES` 数组
 
 ## 严格要求 (MUST DO)
 
 - **发布前必须确认**：执行发布操作前，必须向用户展示幻灯片配置摘要（页数、标题列表），获得用户明确同意后再发布
-- 必须在 `componentDidMount` 中注册键盘事件（含 `PageDown`/`PageUp` 演讲笔支持）
-- 必须在 `componentWillUnmount` 中清理所有事件监听
+- 必须在 `didMount` 中注册键盘事件（含 `PageDown`/`PageUp` 演讲笔支持）
+- 必须在 `didUnmount` 中清理所有事件监听
 - 必须使用 `this.utils.isMobile()` 判断设备类型并适配移动端样式
 - 必须用 `position: fixed; top:0; left:0; right:0; bottom:0` 覆盖宜搭默认容器样式
 - 状态变更必须通过 `_customState.xxx = value; this.forceUpdate()` 触发重渲染
+- 所有可见 `<button>` 必须有真实 `onClick/onMouseDown/onKeyDown` 或显式 `disabled`，发布前 `openyida check-page` 不能出现 `button-missing-handler`
+- 发布前必须执行 `openyida check-page <源文件>`；首次发布建议带 `--health-check`
 - 本技能不读写 memory，所有状态仅在当前页面会话内有效，不跨会话持久化
 
 ## 适用场景
@@ -48,14 +50,15 @@ description: "宜搭自定义页面 PPT 幻灯片开发指南。用于在宜搭
 
 | 异常场景 | 处理方式 |
 |---------|----------|
-| 键盘翻页无响应 | 确认在 `componentDidMount` 中注册了键盘事件，检查 `PageDown`/`PageUp` 支持 |
-| 内存泄漏（切换页面后事件仍触发） | 在 `componentWillUnmount` 中清理所有键盘/触摸事件监听 |
+| 键盘翻页无响应 | 确认在 `didMount` 中注册了键盘事件，检查 `PageDown`/`PageUp` 支持 |
+| 内存泄漏（切换页面后事件仍触发） | 在 `didUnmount` 中清理所有键盘/触摸事件监听 |
 | 图片显示不完整 | 使用 `objectFit: 'contain'` 而非 `cover`，确保完整显示 |
 | 幻灯片数据难以维护 | 将幻灯片数据定义为顶层 `SLIDES` 数组，不得硬编码在 `renderJsx` 中 |
 | 移动端布局异常 | 使用 `this.utils.isMobile()` 判断设备类型并适配移动端样式 |
 | 数字键翻页跳到错误页 | 检查 300ms 延迟缓冲逻辑，确保 `numBuffer` 在跳转后清空 |
 | 导航栏不显示 | 导航默认隐藏，鼠标移到底部 80px 区域才会显示；移动端通过触摸底部触发 |
 | 全屏按钮无效 | 部分浏览器限制 Fullscreen API 必须由用户手势触发，确保在 `onClick` 中调用 |
+| 按钮点不了 | 检查是否写了 `onClick={foo()}`、JSX 小写 `onclick`、只引用不调用的箭头函数，或可见 `<button>` 没有事件；运行 `openyida check-page <file>` 查看具体行号 |
 | 中英文切换后内容未更新 | 确保 `forceUpdate()` 被调用，且 UI 文案从 `I18N[state.lang]` 动态读取 |
 
 ---
@@ -156,16 +159,18 @@ npm install -g openyida@latest
               ↓
 [Step 4] 编写幻灯片代码 → 参考本技能规范 → pages/src/<文件名>.js
               ↓
-[Step 5] 发布页面 → openyida publish <文件> <appType> <formUuid>
+[Step 5] 本地校验 → openyida check-page <文件>
               ↓
-[Step 6] 配置公开访问（可选）→ openyida save-share-config
+[Step 6] 发布页面 → openyida publish <文件> <appType> <formUuid> --health-check
+              ↓
+[Step 7] 配置公开访问（可选）→ openyida save-share-config / update-form-config --is-render-nav false
 ```
 
 ---
 
 ## 技术栈
 
-- **框架**：React 16（类组件模式，禁止使用 Hooks）
+- **框架**：React 16（宜搭原生 `export function` 页面模式，禁止使用 Hooks）
 - **样式**：内联 style（宜搭自定义页面限制）
 - **状态管理**：全局变量 `_customState` + `this.setState({ timestamp: Date.now() })`
 - **导出格式**：`export function`（非 `export default`）
@@ -258,40 +263,42 @@ export function renderJsx() {
 ### 1. 生命周期方法
 
 ```javascript
-// ✅ 使用 componentDidMount 初始化事件监听
-componentDidMount: function() {
+// ✅ 使用 didMount 初始化事件监听
+export function didMount() {
+  var self = this;
+
   // 初始化幻灯片总数
   _customState.total = SLIDES.length;
 
   // 键盘翻页事件（支持演讲笔的 PageDown/PageUp）
   this._handleKeyDown = function(e) {
     if (e.key === 'ArrowRight' || e.key === 'ArrowDown' || e.key === 'PageDown') {
-      this.handleNext();
+      self.handleNext();
     } else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp' || e.key === 'PageUp') {
-      this.handlePrev();
+      self.handlePrev();
     }
-  }.bind(this);
+  };
 
   document.addEventListener('keydown', this._handleKeyDown);
 
   // 触摸滑动支持（移动端）
   this._touchStartX = 0;
   this._handleTouchStart = function(e) {
-    this._touchStartX = e.changedTouches[0].screenX;
-  }.bind(this);
+    self._touchStartX = e.changedTouches[0].screenX;
+  };
 
   this._handleTouchEnd = function(e) {
     var touchEndX = e.changedTouches[0].screenX;
-    if (this._touchStartX - touchEndX > 50) this.handleNext();
-    if (touchEndX - this._touchStartX > 50) this.handlePrev();
-  }.bind(this);
+    if (self._touchStartX - touchEndX > 50) { self.handleNext(); }
+    if (touchEndX - self._touchStartX > 50) { self.handlePrev(); }
+  };
 
   document.addEventListener('touchstart', this._handleTouchStart);
   document.addEventListener('touchend', this._handleTouchEnd);
-},
+}
 
-// ✅ 使用 componentWillUnmount 清理事件监听，防止内存泄漏
-componentWillUnmount: function() {
+// ✅ 使用 didUnmount 清理事件监听，防止内存泄漏
+export function didUnmount() {
   document.removeEventListener('keydown', this._handleKeyDown);
   document.removeEventListener('touchstart', this._handleTouchStart);
   document.removeEventListener('touchend', this._handleTouchEnd);
@@ -302,21 +309,21 @@ componentWillUnmount: function() {
 
 ```javascript
 // ✅ 正确：直接修改 _customState，然后调用 forceUpdate()
-handleNext: function() {
+export function handleNext() {
   if (_customState.currentIndex < SLIDES.length - 1) {
     _customState.currentIndex++;
     this.forceUpdate();  // 触发重渲染
   }
-},
+}
 
-handlePrev: function() {
+export function handlePrev() {
   if (_customState.currentIndex > 0) {
     _customState.currentIndex--;
     this.forceUpdate();
   }
-},
+}
 
-handleGoTo: function(index) {
+export function handleGoTo(index) {
   _customState.currentIndex = index;
   this.forceUpdate();
 }
@@ -328,10 +335,12 @@ handleGoTo: function(index) {
 ### 3. 分页导航（精简版）
 
 ```javascript
-// 在 renderJsx 顶部定义，避免每次渲染创建新函数
-var handleDotClick = function(idx) {
-  return function() { this.handleGoTo(idx); }.bind(this);
-}.bind(this);
+// 在 renderJsx 顶部定义，JSX 中直接引用，避免 onClick={handleDotClick(i)} 渲染期调用
+var self = this;
+var handleDotClick = function(e) {
+  var index = Number(e.currentTarget.getAttribute('data-index'));
+  self.handleGoTo(index);
+};
 
 // 精简分页点（最多显示5个）
 var dots = [];
@@ -352,7 +361,8 @@ for (var i = dotStart; i < dotEnd; i++) {
         transition: 'all 0.3s ease',
         cursor: 'pointer',
       }}
-      onClick={handleDotClick(i)}
+      data-index={i}
+      onClick={handleDotClick}
     />
   );
 }
@@ -632,10 +642,10 @@ var handleLangSwitch = function() {
   {lang.langSwitch}
 </div>
 
-// 导航按钮使用 lang 对象
-<button ...>{lang.prev}</button>
+// 导航按钮使用 lang 对象，button 必须绑定真实事件
+<button onClick={handlePrev}>{lang.prev}</button>
 <span ...>{lang.pageOf(state.currentIndex + 1, SLIDES.length)}</span>
-<button ...>{lang.next}</button>
+<button onClick={handleNext}>{lang.next}</button>
 ```
 
 > **提示**：如果幻灯片内容本身也需要中英文，可以在 `SLIDES` 数组中为每个 slide 提供 `title_en`、`subtitle_en` 等字段，在 `renderSlideContent` 中根据 `state.lang` 选择对应文案。
@@ -1348,7 +1358,7 @@ export function renderJsx() {
 #### dark-tech 注意事项
 
 - 🚨 **禁止 `import`/`require`**：文件顶部不能有任何 import 语句，宜搭沙箱不支持
-- **事件绑定用箭头函数**：`onClick={() => {}}` 不能用 `onClick={function() {}}`
+- **事件绑定必须是真实函数**：可以用 `onClick={handleNext}` 或 `onClick={function() { self.changeSlide(1); }}`；禁止 `onClick={self.changeSlide(1)}` 这种渲染期调用，禁止 JSX 小写 `onclick`（ECharts `graphic.onclick` 不是 JSX 属性，可以保留）
 - **禁止 ES6 计算属性名**：`{ [key]: value }` 改为 `var obj = {}; obj[key] = value;`
 - **Canvas 初始化延迟**：`setTimeout(() => { self.initParticles(); }, 500)` 确保 DOM 就绪
 - **`WebkitBackdropFilter`** 必须与 `backdropFilter` 同时写，兼容 Safari

package/yida-skills/skills/yida-ppt-slider/references/examples.md

@@ -23,8 +23,9 @@ openyida create-page APP_DEMO123 "产品路演2026"
 # Step 4：编写幻灯片代码（见下方代码示例）
 # 输出到 project/pages/src/product-ppt.js
 
-# Step 5：发布页面
-openyida publish project/pages/src/product-ppt.js APP_DEMO123 FORM-PPT001
+# Step 5：校验并发布页面
+openyida check-page project/pages/src/product-ppt.js
+openyida publish project/pages/src/product-ppt.js APP_DEMO123 FORM-PPT001 --health-check
 ```
 
 ### 输出
@@ -147,7 +148,7 @@ var THEME_CONFIG = {
 ### 生命周期与事件绑定
 
 ```javascript
-// ✅ 使用 didMount 注册键盘事件（由运行时映射到 React componentDidMount）
+// ✅ 使用 didMount 注册键盘事件（宜搭运行时会在页面挂载后调用）
 export function didMount() {
   var self = this;
   _customState.total = SLIDES.length;
@@ -368,7 +369,7 @@ export function renderJsx() {
 
 ### 注意事项
 
-- 事件处理函数必须在 `renderJsx` 顶部定义，不要在 JSX 内部创建内联函数
+- 事件处理函数推荐在 `renderJsx` 顶部定义；JSX 中可以直接引用 handler，或用不依赖 `this` 的小包装函数调用 handler。禁止 `onClick={foo()}` 渲染期调用、禁止 JSX 小写 `onclick`
 - 必须在 `didUnmount` 中清理所有事件监听（键盘、鼠标移动、全屏变化、hash 变化、数字键定时器），防止内存泄漏
 - 使用 `position: fixed` 覆盖宜搭默认容器样式
 - 图片使用 `objectFit: 'contain'` 确保完整显示