geg-gas-web/docs/assets/ajax.html-CDfrJfFy.js

import{_ as n,c as a,a as p,o as e}from"./app-CDlLWk6N.js";const t={};function l(o,s){return e(),a("div",null,s[0]||(s[0]=[p(`<h1 id="使用远程数据源" tabindex="-1"><a class="header-anchor" href="#使用远程数据源"><span>使用远程数据源</span></a></h1><p>如果有些组件（联想弹层、下拉框等）的显示数据不想使用预设的数据源或者magicAPI，也可以使用自写的接口。</p><p>如下代码所示，可以在config.ts文件中通过修改对应组件项中的componentProps中的apiCconfig属性来使用自写的接口，datasourceType的属性值应为api。apiParams则为对应的接口请求参数，其中也可以使用当前表单中的参数来充当请求接口的参数，如例子所示。</p><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js"><pre><code><span class="line"><span class="token punctuation">{</span></span>
<span class="line">    <span class="token literal-property property">datasourceType</span><span class="token operator">:</span> <span class="token string">&#39;api&#39;</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token literal-property property">params</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">itemId</span><span class="token operator">:</span> <span class="token string">&#39;&#39;</span> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token literal-property property">apiConfig</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">        <span class="token literal-property property">path</span><span class="token operator">:</span> <span class="token string">&#39;CodeGeneration/selection&#39;</span><span class="token punctuation">,</span></span>
<span class="line">        <span class="token literal-property property">method</span><span class="token operator">:</span> <span class="token string">&#39;GET&#39;</span><span class="token punctuation">,</span></span>
<span class="line">        <span class="token literal-property property">apiId</span><span class="token operator">:</span> <span class="token string">&#39;93d735dcb7364a0f8102188ec4d77ac7&#39;</span><span class="token punctuation">,</span></span>
<span class="line">        <span class="token literal-property property">apiParams</span><span class="token operator">:</span> <span class="token punctuation">[</span></span>
<span class="line">            <span class="token punctuation">{</span> <span class="token literal-property property">key</span><span class="token operator">:</span> <span class="token string">&#39;1&#39;</span><span class="token punctuation">,</span> <span class="token literal-property property">title</span><span class="token operator">:</span> <span class="token string">&#39;Query Params&#39;</span><span class="token punctuation">,</span> <span class="token literal-property property">tableInfo</span><span class="token operator">:</span> <span class="token punctuation">[</span></span>
<span class="line">            <span class="token punctuation">{</span></span>
<span class="line">                <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">&#39;projectId&#39;</span><span class="token punctuation">,</span> <span class="token comment">// 参数名称</span></span>
<span class="line">                <span class="token literal-property property">value</span><span class="token operator">:</span> <span class="token string">&#39;{&quot;bindField&quot;:&quot;selectProjectId&quot;,&quot;fieldKey&quot;:&quot;xxxxxxxxxxxx&quot;}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">                <span class="token comment">// bindField是表单中的字段名即field，fieldKey是的key值，这两个值需要和表单中的值对应。</span></span>
<span class="line">                <span class="token comment">// 当绑定的表单字段值发生变化时，会自动用新参数重新请求接口。</span></span>
<span class="line">                <span class="token comment">// value 也可以是一个固定值，写为正常的字符串即可。</span></span>
<span class="line">                <span class="token literal-property property">description</span><span class="token operator">:</span> <span class="token keyword">null</span><span class="token punctuation">,</span></span>
<span class="line">                <span class="token literal-property property">required</span><span class="token operator">:</span> <span class="token boolean">false</span><span class="token punctuation">,</span></span>
<span class="line">                <span class="token literal-property property">dataType</span><span class="token operator">:</span> <span class="token string">&#39;String&#39;</span><span class="token punctuation">,</span></span>
<span class="line">                <span class="token literal-property property">type</span><span class="token operator">:</span> <span class="token keyword">null</span><span class="token punctuation">,</span></span>
<span class="line">                <span class="token literal-property property">defaultValue</span><span class="token operator">:</span> <span class="token keyword">null</span><span class="token punctuation">,</span></span>
<span class="line">                <span class="token literal-property property">validateType</span><span class="token operator">:</span> <span class="token keyword">null</span><span class="token punctuation">,</span></span>
<span class="line">                <span class="token literal-property property">error</span><span class="token operator">:</span> <span class="token keyword">null</span><span class="token punctuation">,</span></span>
<span class="line">                <span class="token literal-property property">expression</span><span class="token operator">:</span> <span class="token keyword">null</span><span class="token punctuation">,</span></span>
<span class="line">                <span class="token literal-property property">children</span><span class="token operator">:</span> <span class="token keyword">null</span><span class="token punctuation">,</span></span>
<span class="line">                <span class="token literal-property property">bindType</span><span class="token operator">:</span> <span class="token string">&#39;data&#39;</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token comment">//多个参数时，只需要在数组中添加即可。</span></span>
<span class="line">            <span class="token punctuation">]</span> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token punctuation">{</span> <span class="token literal-property property">key</span><span class="token operator">:</span> <span class="token string">&#39;2&#39;</span><span class="token punctuation">,</span> <span class="token literal-property property">title</span><span class="token operator">:</span> <span class="token string">&#39;Header&#39;</span><span class="token punctuation">,</span> <span class="token literal-property property">tableInfo</span><span class="token operator">:</span> <span class="token punctuation">[</span><span class="token punctuation">]</span> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token punctuation">{</span> <span class="token literal-property property">key</span><span class="token operator">:</span> <span class="token string">&#39;3&#39;</span><span class="token punctuation">,</span> <span class="token literal-property property">title</span><span class="token operator">:</span> <span class="token string">&#39;Body&#39;</span> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">        <span class="token punctuation">]</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"><span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div>`,4)]))}const c=n(t,[["render",l]]),i=JSON.parse('{"path":"/front_dev/base/ajax.html","title":"使用远程数据源","lang":"en-US","frontmatter":{},"headers":[],"git":{"updatedTime":1744278865000,"contributors":[{"name":"DESKTOP-45LLIKH\\\\11405","username":"","email":"1140589958@qq.com","commits":3}],"changelog":[{"hash":"a3e2cde9db0dbccdbce661749aef03650a6b701f","time":1744278865000,"email":"1140589958@qq.com","author":"DESKTOP-45LLIKH\\\\11405","message":"feat: 二开文档优化"},{"hash":"51b826e36d1d26ef2ed843c669a1ab12b3fcb8f5","time":1744257372000,"email":"1140589958@qq.com","author":"DESKTOP-45LLIKH\\\\11405","message":"feat: 文档优化 新写 为工具栏添加按钮， 为表单新添加新字段"},{"hash":"bb33c9cfb0a16dc1df1c8e1434b41b052a489710","time":1744192947000,"email":"1140589958@qq.com","author":"DESKTOP-45LLIKH\\\\11405","message":"feat:  值计算，修改组件值，自定义校验，使用远程数据源"}]},"filePathRelative":"front_dev/base/ajax.md"}');export{c as comp,i as data};