mirror of
https://github.com/Tencent/tmagic-editor.git
synced 2026-06-06 07:30:16 +00:00
28 lines
28 KiB
JavaScript
28 lines
28 KiB
JavaScript
import{ax as a,z as s,A as e,b5 as t}from"./chunks/framework.V2ssSR2R.js";const k=JSON.parse('{"title":"DataSourceManager","description":"","frontmatter":{},"headers":[],"relativePath":"runtime-api/data-source/dataSourceManager.md","filePath":"runtime-api/data-source/dataSourceManager.md"}'),l={name:"runtime-api/data-source/dataSourceManager.md"};function n(d,i,r,o,h,p){return e(),s("div",null,[...i[0]||(i[0]=[t(`<h1 id="datasourcemanager" tabindex="-1">DataSourceManager <a class="header-anchor" href="#datasourcemanager" aria-label="Permalink to “DataSourceManager”"></a></h1><p><code>DataSourceManager</code> 是 <code>@tmagic/data-source</code> 的核心类,用于管理所有数据源的生命周期、数据编译和事件分发。</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;"> DataSourceManager</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(options: DataSourceManagerOptions)</span></span></code></pre></div><h3 id="datasourcemanageroptions" tabindex="-1">DataSourceManagerOptions <a class="header-anchor" href="#datasourcemanageroptions" aria-label="Permalink to “DataSourceManagerOptions”"></a></h3><table tabindex="0"><thead><tr><th>参数</th><th>类型</th><th>说明</th></tr></thead><tbody><tr><td><code>app</code></td><td><code>TMagicApp</code></td><td>应用实例</td></tr><tr><td><code>initialData</code></td><td><code>DataSourceManagerData</code></td><td>初始数据(可选,用于 SSR)</td></tr><tr><td><code>useMock</code></td><td><code>boolean</code></td><td>是否使用 Mock 数据(可选)</td></tr></tbody></table><h2 id="属性" tabindex="-1">属性 <a class="header-anchor" href="#属性" aria-label="Permalink to “属性”"></a></h2><table tabindex="0"><thead><tr><th>属性</th><th>类型</th><th>说明</th></tr></thead><tbody><tr><td><code>app</code></td><td><code>TMagicApp</code></td><td>应用实例</td></tr><tr><td><code>dataSourceMap</code></td><td><code>Map<string, DataSource></code></td><td>数据源映射表</td></tr><tr><td><code>data</code></td><td><code>DataSourceManagerData</code></td><td>所有数据源的数据</td></tr><tr><td><code>initialData</code></td><td><code>DataSourceManagerData</code></td><td>初始化数据</td></tr><tr><td><code>useMock</code></td><td><code>boolean</code></td><td>是否使用 Mock 数据</td></tr></tbody></table><h2 id="静态方法" tabindex="-1">静态方法 <a class="header-anchor" href="#静态方法" aria-label="Permalink to “静态方法”"></a></h2><h3 id="register" tabindex="-1">register <a class="header-anchor" href="#register" aria-label="Permalink to “register”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{string} type</code> 数据源类型</li><li><code>{typeof DataSource} dataSourceClass</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:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { DataSourceManager } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> '@tmagic/data-source'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
||
<span class="line"></span>
|
||
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">class</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> CustomDataSource</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> extends</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> DataSource</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></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;">}</span></span>
|
||
<span class="line"></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">DataSourceManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">register</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'custom'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, CustomDataSource);</span></span></code></pre></div><h3 id="getdatasourceclass" tabindex="-1">getDataSourceClass <a class="header-anchor" href="#getdatasourceclass" aria-label="Permalink to “getDataSourceClass”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{string} type</code> 数据源类型</li></ul></li><li><p><strong>返回:</strong></p><ul><li><code>{typeof DataSource | undefined}</code></li></ul></li><li><p><strong>详情:</strong></p><p>获取已注册的数据源类。</p></li></ul><h3 id="cleardatasourceclass" tabindex="-1">clearDataSourceClass <a class="header-anchor" href="#cleardatasourceclass" aria-label="Permalink to “clearDataSourceClass”"></a></h3><ul><li><p><strong>返回:</strong></p><ul><li><code>{void}</code></li></ul></li><li><p><strong>详情:</strong></p><p>清除所有已注册的数据源类(保留 <code>base</code> 和 <code>http</code>)。</p></li></ul><h3 id="registerobserveddata" tabindex="-1">registerObservedData <a class="header-anchor" href="#registerobserveddata" aria-label="Permalink to “registerObservedData”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{ObservedDataClass} observedDataClass</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></ul><h2 id="实例方法" tabindex="-1">实例方法 <a class="header-anchor" href="#实例方法" aria-label="Permalink to “实例方法”"></a></h2><h3 id="init" tabindex="-1">init <a class="header-anchor" href="#init" aria-label="Permalink to “init”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{DataSource} ds</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>methods</code> 中 <code>timing === 'beforeInit'</code> 的方法依次执行,再调用 <code>ds.init()</code>,最后执行 <code>timing === 'afterInit'</code> 的方法。当 <code>ds.isInit</code> 为 <code>true</code>,或当前 <code>app.jsEngine</code> 命中 <code>ds.schema.disabledInitInJsEngine</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;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> ds</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> dataSourceManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">get</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>
|
||
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (ds) {</span></span>
|
||
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> dataSourceManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">init</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(ds);</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><h3 id="get" tabindex="-1">get <a class="header-anchor" href="#get" aria-label="Permalink to “get”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{string} id</code> 数据源 ID</li></ul></li><li><p><strong>返回:</strong></p><ul><li><code>{DataSource | undefined}</code></li></ul></li><li><p><strong>详情:</strong></p><p>获取指定 ID 的数据源实例。</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;"> ds</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> dataSourceManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">get</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></code></pre></div><h3 id="adddatasource" tabindex="-1">addDataSource <a class="header-anchor" href="#adddatasource" aria-label="Permalink to “addDataSource”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{DataSourceSchema} config</code> 数据源配置(可选)</li></ul></li><li><p><strong>返回:</strong></p><ul><li><code>{DataSource | undefined}</code></li></ul></li><li><p><strong>详情:</strong></p><p>添加新的数据源。当对应类型尚未注册(即 <code>dataSourceClassMap</code> 中无该类型)时,会将配置缓存到 <code>waitInitSchemaList</code>,并返回 <code>undefined</code>,待 <code>register</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;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> ds</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> dataSourceManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addDataSource</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> id: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'new_ds'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> type: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'base'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> fields: []</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h3 id="removedatasource" tabindex="-1">removeDataSource <a class="header-anchor" href="#removedatasource" aria-label="Permalink to “removeDataSource”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{string} id</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></ul><h3 id="setdata" tabindex="-1">setData <a class="header-anchor" href="#setdata" aria-label="Permalink to “setData”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{DataSource} ds</code> 数据源实例</li><li><code>{ChangeEvent} changeEvent</code> 变化事件,形如 <code>{ updateData, 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>ds.data</code> 同步到 <code>this.data[ds.id]</code>,并以 <code>(ds.id, changeEvent)</code> 触发 <code>change</code> 事件。</p></li></ul><h3 id="updateschema" tabindex="-1">updateSchema <a class="header-anchor" href="#updateschema" aria-label="Permalink to “updateSchema”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{DataSourceSchema[]} schemas</code> 数据源配置数组</li></ul></li><li><p><strong>返回:</strong></p><ul><li><code>{void}</code></li></ul></li><li><p><strong>详情:</strong></p><p>同步更新数据源 DSL 配置:先按 <code>id</code> 移除已有数据源,再以 <code>cloneDeep</code> 重新 <code>addDataSource</code>,并对新建实例触发 <code>init</code>(异步执行,不会被该方法 <code>await</code>)。一般在编辑器中修改配置后调用。</p></li></ul><h3 id="compilednode" tabindex="-1">compiledNode <a class="header-anchor" href="#compilednode" aria-label="Permalink to “compiledNode”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{MNode} node</code> 节点配置</li><li><code>{string} sourceId</code> 数据源 ID(可选)</li><li><code>{boolean} deep</code> 是否深度编译(可选)</li></ul></li><li><p><strong>返回:</strong></p><ul><li><code>{MNode}</code></li></ul></li><li><p><strong>详情:</strong></p><p>编译节点 DSL 中的数据源配置,将数据源引用替换为实际值。</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;"> compiledNode</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> dataSourceManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">compiledNode</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> id: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'text_1'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> type: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'text'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'\${ds_1.username}'</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span>
|
||
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// compiledNode.text 会被替换为实际的用户名</span></span></code></pre></div><h3 id="compliedconds" tabindex="-1">compliedConds <a class="header-anchor" href="#compliedconds" aria-label="Permalink to “compliedConds”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{ { [NODE_CONDS_KEY]?: DisplayCond[]; [NODE_CONDS_RESULT_KEY]?: boolean; [NODE_DISABLE_DATA_SOURCE_KEY]?: boolean } } node</code> 带条件字段的结构(不要求是完整的 MNode)</li><li><code>{DataSourceManagerData} data</code> 数据上下文(可选,默认使用 <code>this.data</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;"> shouldShow</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> dataSourceManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">compliedConds</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(node);</span></span></code></pre></div><h3 id="compliediteratoritemconds" tabindex="-1">compliedIteratorItemConds <a class="header-anchor" href="#compliediteratoritemconds" aria-label="Permalink to “compliedIteratorItemConds”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{any} itemData</code> 迭代项数据</li><li><code>{ { [NODE_CONDS_KEY]?: DisplayCond[] } } node</code> 带条件字段的结构</li><li><code>{string[]} dataSourceField</code> 迭代数据在数据源中的字段路径,格式如 <code>['dsId', 'key1', 'key2']</code>(可选,默认 <code>[]</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></ul><h3 id="compliediteratoritems" tabindex="-1">compliedIteratorItems <a class="header-anchor" href="#compliediteratoritems" aria-label="Permalink to “compliedIteratorItems”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{any} itemData</code> 迭代项数据</li><li><code>{MNode[]} nodes</code> 节点配置数组</li><li><code>{string[]} dataSourceField</code> 迭代数据在数据源中的字段路径(可选,默认 <code>[]</code>)</li></ul></li><li><p><strong>返回:</strong></p><ul><li><code>{MNode[]}</code></li></ul></li><li><p><strong>详情:</strong></p><p>编译迭代器项的节点配置。</p></li></ul><h3 id="isalldatasourceregistered" tabindex="-1">isAllDataSourceRegistered <a class="header-anchor" href="#isalldatasourceregistered" aria-label="Permalink to “isAllDataSourceRegistered”"></a></h3><ul><li><p><strong>返回:</strong></p><ul><li><code>{boolean}</code></li></ul></li><li><p><strong>详情:</strong></p><p>判断 DSL 中声明的所有数据源是否都已注册并实例化(即 <code>dataSourceMap.size === dsl.dataSources.length</code>,或 DSL 未声明数据源)。</p><div class="tip custom-block"><p class="custom-block-title"><code>registered-all</code> 触发时机</p><p><code>registered-all</code> 事件<strong>仅</strong>在 <code>addDataSource</code> 末尾、<code>isAllDataSourceRegistered()</code> 为真时触发。当 <code>dsl.dataSources</code> 为空数组时,构造函数不会进入任何一次 <code>addDataSource</code> 调用,因此<strong>不会</strong>触发该事件,但仍可能执行 <code>callDsInit()</code>。</p></div></li></ul><h3 id="ondatachange" tabindex="-1">onDataChange <a class="header-anchor" href="#ondatachange" aria-label="Permalink to “onDataChange”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{string} id</code> 数据源 ID</li><li><code>{string} path</code> 数据路径</li><li><code>{(payload: any) => void} callback</code> 回调函数(具体入参取决于 <code>ObservedData</code> 实现,详见 <a href="./dataSource.html#ondatachange">DataSource.onDataChange</a>)</li><li><code>{ { immediate?: boolean } } options</code> 选项(可选)</li></ul></li><li><p><strong>返回:</strong></p><ul><li><code>{void}</code></li></ul></li><li><p><strong>详情:</strong></p><p>监听数据源数据变化。<code>options.immediate</code> 为 <code>true</code> 时,订阅后立即用当前值触发一次回调(具体语义取决于 <code>ObservedData</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;">dataSourceManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">onDataChange</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;">'user.name'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">newVal</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=></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;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'用户名变更:'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, newVal);</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h3 id="offdatachange" tabindex="-1">offDataChange <a class="header-anchor" href="#offdatachange" aria-label="Permalink to “offDataChange”"></a></h3><ul><li><p><strong>参数:</strong></p><ul><li><code>{string} id</code> 数据源 ID</li><li><code>{string} path</code> 数据路径</li><li><code>{(newVal: any) => void} callback</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></ul><h3 id="destroy" tabindex="-1">destroy <a class="header-anchor" href="#destroy" aria-label="Permalink to “destroy”"></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><h2 id="事件" tabindex="-1">事件 <a class="header-anchor" href="#事件" aria-label="Permalink to “事件”"></a></h2><p>DataSourceManager 继承自 EventEmitter,支持以下事件:</p><table tabindex="0"><thead><tr><th>事件名</th><th>说明</th><th>回调参数</th></tr></thead><tbody><tr><td><code>change</code></td><td>单个数据源数据变化</td><td><code>(dsId: string, changeEvent: ChangeEvent)</code></td></tr><tr><td><code>init</code></td><td>所有数据源初始化完成;现代分支携带 <code>(data, errors)</code>,旧 Promise.all 分支为 <code>(this.data)</code></td><td><code>(data, errors?)</code></td></tr><tr><td><code>registered-all</code></td><td>所有数据源注册完成</td><td>无</td></tr><tr><td><code>update-data</code></td><td>由 <code>createDataSourceManager</code> 在数据变化后发出,用于通知节点重新渲染</td><td><code>(newNodes: MNode[], sourceId: string, changeEvent: ChangeEvent, pageId: Id)</code></td></tr></tbody></table><h3 id="事件监听示例" tabindex="-1">事件监听示例 <a class="header-anchor" href="#事件监听示例" aria-label="Permalink to “事件监听示例”"></a></h3><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;">dataSourceManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">on</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'change'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">dsId</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">changeEvent</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=></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;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">\`数据源 \${</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">dsId</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">} 变更:\`</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, changeEvent);</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span>
|
||
<span class="line"></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">dataSourceManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">on</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'init'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">data</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">errors</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=></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;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">'所有数据源初始化完成'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, data, errors);</span></span>
|
||
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div>`,58)])])}const g=a(l,[["render",n]]);export{k as __pageData,g as default};
|