mirror of
https://github.com/Tencent/tmagic-editor.git
synced 2026-06-06 07:30:16 +00:00
12 lines
18 KiB
JavaScript
12 lines
18 KiB
JavaScript
import{ax as s,z as a,A as e,b5 as l}from"./chunks/framework.V2ssSR2R.js";const c=JSON.parse('{"title":"DevtoolApi","description":"","frontmatter":{},"headers":[],"relativePath":"runtime-api/core/devtoolApi.md","filePath":"runtime-api/core/devtoolApi.md"}'),t={name:"runtime-api/core/devtoolApi.md"};function n(p,i,o,d,h,r){return e(),a("div",null,[...i[0]||(i[0]=[l(`<h1 id="devtoolapi" tabindex="-1">DevtoolApi <a class="header-anchor" href="#devtoolapi" aria-label="Permalink to “DevtoolApi”"></a></h1><p><code>DevtoolApi</code> 是 <code>@tmagic/core</code> 提供给开发工具使用的 API 接口类。</p><h2 id="构造函数" tabindex="-1">构造函数 <a class="header-anchor" href="#构造函数" aria-label="Permalink to “构造函数”"></a></h2><div class="language-typescript"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> DevtoolApi</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(options: DevtoolApiOptions)</span></span></code></pre></div><h3 id="devtoolapioptions" tabindex="-1">DevtoolApiOptions <a class="header-anchor" href="#devtoolapioptions" aria-label="Permalink to “DevtoolApiOptions”"></a></h3><table tabindex="0"><thead><tr><th>参数</th><th>类型</th><th>说明</th></tr></thead><tbody><tr><td><code>app</code></td><td><code>App</code></td><td>应用实例</td></tr></tbody></table><h2 id="实例方法" tabindex="-1">实例方法 <a class="header-anchor" href="#实例方法" aria-label="Permalink to “实例方法”"></a></h2><h3 id="openpop" tabindex="-1">openPop <a class="header-anchor" href="#openpop" aria-label="Permalink to “openPop”"></a></h3><ul><li><p><strong>参数：</strong></p><ul><li><code>{Id} popId</code> 弹窗组件 ID</li></ul></li><li><p><strong>返回：</strong></p><ul><li><code>{void}</code></li></ul></li><li><p><strong>详情：</strong></p><p>打开指定的弹窗组件。</p></li><li><p><strong>示例：</strong></p></li></ul><div class="language-typescript"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">devtoolApi.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">openPop</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'dialog_1'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span></code></pre></div><h3 id="setdatasourcedata" tabindex="-1">setDataSourceData <a class="header-anchor" href="#setdatasourcedata" aria-label="Permalink to “setDataSourceData”"></a></h3><ul><li><p><strong>参数：</strong></p><ul><li><code>{Id} dsId</code> 数据源 ID</li><li><code>{any} data</code> 数据</li><li><code>{string} path</code> 数据路径（可选）</li></ul></li><li><p><strong>返回：</strong></p><ul><li><code>{void}</code></li></ul></li><li><p><strong>详情：</strong></p><p>设置数据源的数据。</p></li><li><p><strong>示例：</strong></p></li></ul><div class="language-typescript"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 设置整个数据源数据</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">devtoolApi.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">setDataSourceData</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'ds_1'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, { name: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'test'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> });</span></span>
|
||
<span class="line"></span>
|
||
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 设置数据源的某个字段</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">devtoolApi.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">setDataSourceData</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'ds_1'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'newValue'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'user.name'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span></code></pre></div><h3 id="deldatasourcedata" tabindex="-1">delDataSourceData <a class="header-anchor" href="#deldatasourcedata" aria-label="Permalink to “delDataSourceData”"></a></h3><ul><li><p><strong>返回：</strong></p><ul><li><code>{void}</code></li></ul></li><li><p><strong>详情：</strong></p><p>当前为空实现（预留接口），由具体的开发工具/平台覆盖以实现"删除数据源数据"的能力。</p></li></ul><h3 id="requestdatasource" tabindex="-1">requestDataSource <a class="header-anchor" href="#requestdatasource" aria-label="Permalink to “requestDataSource”"></a></h3><ul><li><p><strong>参数：</strong></p><ul><li><code>{Id} dsId</code> 数据源 ID</li></ul></li><li><p><strong>返回：</strong></p><ul><li><code>{Promise<void> | void}</code></li></ul></li><li><p><strong>详情：</strong></p><p>触发 HTTP 数据源的请求。优先调用 <code>dataSource.refresh</code>，否则调用 <code>dataSource.request</code>，再否则将 <code>isInit</code> 置为 <code>false</code> 并通过 <code>dataSourceManager.init(ds)</code> 重新初始化。</p></li><li><p><strong>示例：</strong></p></li></ul><div class="language-typescript"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> devtoolApi.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">requestDataSource</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'http_ds_1'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span></code></pre></div><h3 id="getdisplaycondrealvalue" tabindex="-1">getDisplayCondRealValue <a class="header-anchor" href="#getdisplaycondrealvalue" aria-label="Permalink to “getDisplayCondRealValue”"></a></h3><ul><li><p><strong>参数：</strong></p><ul><li><code>{Id} nodeId</code> 节点 ID</li><li><code>{DisplayCondItem} condItem</code> 单个条件项</li></ul></li><li><p><strong>返回：</strong></p><ul><li><code>{any}</code></li></ul></li><li><p><strong>详情：</strong></p><p>获取显示条件的实际计算值。内部会以 <code>{ [NODE_CONDS_KEY]: [{ cond: [condItem] }] }</code> 的形式调用 <code>dataSourceManager.compliedConds</code>。</p></li></ul><h3 id="callhook" tabindex="-1">callHook <a class="header-anchor" href="#callhook" aria-label="Permalink to “callHook”"></a></h3><ul><li><p><strong>参数：</strong></p><ul><li><code>{Id} nodeId</code> 节点 ID</li><li><code>{string} hookName</code> 钩子名称</li><li><code>{ { params: Record<string, any> }[] } hookData</code> 钩子数据列表，依次传给 <code>node.runHookCode</code></li></ul></li><li><p><strong>返回：</strong></p><ul><li><code>{Promise<void>}</code></li></ul></li><li><p><strong>详情：</strong></p><p>调用节点的钩子函数。会按 <code>hookData</code> 顺序执行，每项以 <code>item.params</code> 作为 <code>runHookCode</code> 的入参。</p></li><li><p><strong>示例：</strong></p></li></ul><div class="language-typescript"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> devtoolApi.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">callHook</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'button_1'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'mounted'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, [</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { params: { data: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'test'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> } },</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">]);</span></span></code></pre></div><h3 id="trigger" tabindex="-1">trigger <a class="header-anchor" href="#trigger" aria-label="Permalink to “trigger”"></a></h3><ul><li><p><strong>参数：</strong></p><ul><li><code>{Id} nodeId</code> 节点 ID</li><li><code>{EventConfig} eventConfig</code> 事件配置（单个，非数组）</li></ul></li><li><p><strong>返回：</strong></p><ul><li><code>{void}</code></li></ul></li><li><p><strong>详情：</strong></p><p>按节点触发事件。内部通过 <code>app.emit(eventConfig.name, node)</code> 触发对应事件。</p></li><li><p><strong>示例：</strong></p></li></ul><div class="language-typescript"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">devtoolApi.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">trigger</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'button_1'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, {</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> name: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'click'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> actions: [{ actionType: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'code'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, codeId: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'code_1'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }]</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h3 id="updatedsl" tabindex="-1">updateDsl <a class="header-anchor" href="#updatedsl" aria-label="Permalink to “updateDsl”"></a></h3><ul><li><p><strong>参数：</strong></p><ul><li><code>{Id} nodeId</code> 节点 ID</li><li><code>{any} data</code> 数据</li><li><code>{string} path</code> 路径</li></ul></li><li><p><strong>返回：</strong></p><ul><li><code>{void}</code></li></ul></li><li><p><strong>详情：</strong></p><p>当前为空实现（预留接口），由具体的开发工具/平台覆盖以实现"按节点更新 DSL"的能力。</p></li></ul><h3 id="isvalueincludedatasource" tabindex="-1">isValueIncludeDataSource <a class="header-anchor" href="#isvalueincludedatasource" aria-label="Permalink to “isValueIncludeDataSource”"></a></h3><ul><li><p><strong>参数：</strong></p><ul><li><code>{any} value</code> 要检查的值</li></ul></li><li><p><strong>返回：</strong></p><ul><li><code>{boolean}</code></li></ul></li><li><p><strong>详情：</strong></p><p>检查值是否包含数据源引用。</p></li><li><p><strong>示例：</strong></p></li></ul><div class="language-typescript"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> hasDs</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> devtoolApi.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">isValueIncludeDataSource</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'\${ds_1.field}'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(hasDs); </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// true</span></span></code></pre></div><h3 id="compiledatasourcevalue" tabindex="-1">compileDataSourceValue <a class="header-anchor" href="#compiledatasourcevalue" aria-label="Permalink to “compileDataSourceValue”"></a></h3><ul><li><p><strong>参数：</strong></p><ul><li><code>{any} value</code> 包含数据源引用的值</li></ul></li><li><p><strong>返回：</strong></p><ul><li><code>{any}</code></li></ul></li><li><p><strong>详情：</strong></p><p>编译数据源值，将数据源引用替换为实际值。</p></li><li><p><strong>示例：</strong></p></li></ul><div class="language-typescript"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> compiled</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> devtoolApi.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">compileDataSourceValue</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'用户名：\${ds_1.user.name}'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span></code></pre></div><h3 id="updatecode" tabindex="-1">updateCode <a class="header-anchor" href="#updatecode" aria-label="Permalink to “updateCode”"></a></h3><ul><li><p><strong>参数：</strong></p><ul><li><code>{Id} codeId</code> 代码块 ID</li><li><code>{any} value</code> 新值</li><li><code>{string} path</code> 路径（必填）</li></ul></li><li><p><strong>返回：</strong></p><ul><li><code>{void}</code></li></ul></li><li><p><strong>详情：</strong></p><p>按 <code>path</code> 更新指定代码块的内容。当 <code>path === 'content'</code> 且 <code>value</code> 为字符串时，<strong>当前实现</strong>会通过 <code>eval</code> 拼接执行后将函数写回。</p><div class="warning custom-block"><p class="custom-block-title">已知限制</p><p>当前 <code>eval</code> 模板存在多余的右括号（详见 <code>packages/core/src/DevtoolApi.ts</code> 中 <code>updateCode</code>），<strong>对大部分常规函数字面量会因语法错误抛出</strong>。直接传入纯函数体或可被裸赋值的合法表达式时也需自行验证；如需稳定使用建议在调用方先编译为函数再写回 <code>app.codeDsl[codeId].content</code>，或等待该实现修复。</p></div></li><li><p><strong>示例：</strong></p></li></ul><div class="language-typescript"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">devtoolApi.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">updateCode</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'code_1'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'return data.value * 2;'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'content'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span></code></pre></div>`,37)])])}const g=s(t,[["render",n]]);export{c as __pageData,g as default};
|