blackteay/fes.js
1
0
Fork 0
mirror of https://github.com/WeBankFinTech/fes.js.git synced 2025-04-06 03:59:53 +08:00
Code Issues Projects Releases Wiki Activity
fes.js/assets/mock.html.0f7c7945.js

161 lines
35 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import{_ as c,r as p,o as i,c as l,b as s,d as n,a as t,w as u,f as a}from"./app.0e52fd78.js";const r={},k=a(`<h1 id="mock-数据" tabindex="-1"><a class="header-anchor" href="#mock-数据" aria-hidden="true">#</a> Mock 数据</h1><p>Mock 数据是前端开发过程中必不可少的一环，是分离前后端开发的关键链路。通过预先跟服务器端约定好的接口，模拟请求数据甚至逻辑，能够让前端开发独立自主，不会被服务端的开发所阻塞。</p><h2 id="约定式-mock-文件" tabindex="-1"><a class="header-anchor" href="#约定式-mock-文件" aria-hidden="true">#</a> 约定式 Mock 文件</h2><p>Fes.js 约定 <code>./mock.js</code> 为 mock 文件。</p><p>比如：</p><div class="language-text line-numbers-mode" data-ext="text"><pre class="language-text"><code>.
├── mock.js
└── src
└── pages
└── index.vue
</code></pre><div class="line-numbers" aria-hidden="true"><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><h2 id="编写-mock-文件" tabindex="-1"><a class="header-anchor" href="#编写-mock-文件" aria-hidden="true">#</a> 编写 Mock 文件</h2><p>可以参考如下 🌰：</p><div class="language-javascript line-numbers-mode" data-ext="js"><pre class="language-javascript"><code><span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter"><span class="token punctuation">{</span> cgiMock<span class="token punctuation">,</span> mockjs<span class="token punctuation">,</span> utils <span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token keyword">const</span> <span class="token punctuation">{</span> Random <span class="token punctuation">}</span> <span class="token operator">=</span> mockjs<span class="token punctuation">;</span>
<span class="token comment">// 测试 proxy 与 mock 用例集合</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token string">&#39;/movie/in_theaters_mock&#39;</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token parameter">req<span class="token punctuation">,</span> res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
res<span class="token punctuation">.</span><span class="token function">send</span><span class="token punctuation">(</span>
<span class="token constant">JSON</span><span class="token punctuation">.</span><span class="token function">stringify</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
<span class="token literal-property property">code</span><span class="token operator">:</span> <span class="token string">&#39;0&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">msg</span><span class="token operator">:</span> <span class="token string">&#39;&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">result</span><span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token literal-property property">text</span><span class="token operator">:</span> <span class="token string">&#39;movie: movie/in_theaters_mock ~~~~~&#39;</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token string">&#39;/movie/test_mock&#39;</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token parameter">req<span class="token punctuation">,</span> res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
res<span class="token punctuation">.</span><span class="token function">send</span><span class="token punctuation">(</span>
<span class="token constant">JSON</span><span class="token punctuation">.</span><span class="token function">stringify</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
<span class="token literal-property property">code</span><span class="token operator">:</span> <span class="token string">&#39;0&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">msg</span><span class="token operator">:</span> <span class="token string">&#39;&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">result</span><span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token literal-property property">text</span><span class="token operator">:</span> <span class="token string">&#39;mock: movie/test_mock&#39;</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 测试用例: mock.js change，重现请求，需要能拉最新的数据</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token string">&#39;/watchtest&#39;</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token parameter">req<span class="token punctuation">,</span> res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
res<span class="token punctuation">.</span><span class="token function">send</span><span class="token punctuation">(</span>
<span class="token constant">JSON</span><span class="token punctuation">.</span><span class="token function">stringify</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
<span class="token literal-property property">code</span><span class="token operator">:</span> <span class="token string">&#39;0&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">msg</span><span class="token operator">:</span> <span class="token string">&#39;&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">result</span><span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token literal-property property">text</span><span class="token operator">:</span> <span class="token string">&#39;通过 register 测试 mock watch: 初始状态&#39;</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 返回一个数字</span>
<span class="token comment">// cgiMock(&#39;/number&#39;, 666);</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token string">&#39;/number&#39;</span><span class="token punctuation">,</span> <span class="token number">999</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 返回一个json</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
<span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token string">&#39;/json&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">result</span><span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token literal-property property">code</span><span class="token operator">:</span> <span class="token string">&#39;400101&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">msg</span><span class="token operator">:</span> <span class="token string">&quot;不合法的请求:Missing cookie &#39;wb_app_id&#39; for method parameter of type String&quot;</span><span class="token punctuation">,</span>
<span class="token literal-property property">transactionTime</span><span class="token operator">:</span> <span class="token string">&#39;20170309171146&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">success</span><span class="token operator">:</span> <span class="token boolean">false</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 利用 mock.js 产生随机文本</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token string">&#39;/text&#39;</span><span class="token punctuation">,</span> Random<span class="token punctuation">.</span><span class="token function">cparagraph</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 返回一个字符串 利用 mock.js 产生随机字符</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span>
<span class="token string">&#39;/random&#39;</span><span class="token punctuation">,</span>
mockjs<span class="token punctuation">.</span><span class="token function">mock</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
<span class="token string-property property">&#39;string|1-10&#39;</span><span class="token operator">:</span> <span class="token string">&#39;★&#39;</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 正则匹配url, 返回一个字符串</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token regex"><span class="token regex-delimiter">/</span><span class="token regex-source language-regex">\\/abc|\\/xyz</span><span class="token regex-delimiter">/</span></span><span class="token punctuation">,</span> <span class="token string">&#39;regexp test!&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// option.result 参数如果是一个函数, 可以实现自定义返回内容, 接收的参数是是经过 express 封装的 req 和 res 对象.</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token regex"><span class="token regex-delimiter">/</span><span class="token regex-source language-regex">\\/function$</span><span class="token regex-delimiter">/</span></span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token parameter">req<span class="token punctuation">,</span> res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
res<span class="token punctuation">.</span><span class="token function">send</span><span class="token punctuation">(</span><span class="token string">&#39;function test&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 返回文本 readFileSync</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token string">&#39;/file&#39;</span><span class="token punctuation">,</span> utils<span class="token punctuation">.</span><span class="token function">file</span><span class="token punctuation">(</span><span class="token string">&#39;./package.json&#39;</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 更复杂的规则配置</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
<span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token regex"><span class="token regex-delimiter">/</span><span class="token regex-source language-regex">\\/who</span><span class="token regex-delimiter">/</span></span><span class="token punctuation">,</span>
<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 class="token function">result</span><span class="token punctuation">(</span><span class="token parameter">req<span class="token punctuation">,</span> res</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token keyword">if</span> <span class="token punctuation">(</span>req<span class="token punctuation">.</span>query<span class="token punctuation">.</span>name <span class="token operator">===</span> <span class="token string">&#39;kwan&#39;</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
res<span class="token punctuation">.</span><span class="token function">json</span><span class="token punctuation">(</span><span class="token punctuation">{</span> <span class="token literal-property property">kwan</span><span class="token operator">:</span> <span class="token string">&#39;孤独患者&#39;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span>
res<span class="token punctuation">.</span><span class="token function">send</span><span class="token punctuation">(</span><span class="token string">&#39;Nooooooooooo&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token literal-property property">headers</span><span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token string-property property">&#39;Content-Type&#39;</span><span class="token operator">:</span> <span class="token string">&#39;text/plain&#39;</span><span class="token punctuation">,</span>
<span class="token string-property property">&#39;Content-Length&#39;</span><span class="token operator">:</span> <span class="token string">&#39;123&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">ETag</span><span class="token operator">:</span> <span class="token string">&#39;12345&#39;</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token literal-property property">cookies</span><span class="token operator">:</span> <span class="token punctuation">[</span>
<span class="token punctuation">{</span>
<span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">&#39;myname&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">value</span><span class="token operator">:</span> <span class="token string">&#39;kwan&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">maxAge</span><span class="token operator">:</span> <span class="token number">900000</span><span class="token punctuation">,</span>
<span class="token literal-property property">httpOnly</span><span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">]</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 携带参数的请求</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token string">&#39;/v2/audit/list&#39;</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token parameter">req<span class="token punctuation">,</span> res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
<span class="token keyword">const</span> <span class="token punctuation">{</span> currentPage<span class="token punctuation">,</span> pageSize<span class="token punctuation">,</span> isAudited <span class="token punctuation">}</span> <span class="token operator">=</span> req<span class="token punctuation">.</span>body<span class="token punctuation">;</span>
res<span class="token punctuation">.</span><span class="token function">send</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
<span class="token literal-property property">code</span><span class="token operator">:</span> <span class="token string">&#39;0&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">msg</span><span class="token operator">:</span> <span class="token string">&#39;&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">data</span><span class="token operator">:</span> <span class="token punctuation">{</span>
currentPage<span class="token punctuation">,</span>
pageSize<span class="token punctuation">,</span>
<span class="token literal-property property">totalPage</span><span class="token operator">:</span> <span class="token number">2</span><span class="token punctuation">,</span>
<span class="token literal-property property">totalCount</span><span class="token operator">:</span> <span class="token number">12</span><span class="token punctuation">,</span>
<span class="token literal-property property">pageData</span><span class="token operator">:</span> Array<span class="token punctuation">.</span><span class="token function">from</span><span class="token punctuation">(</span><span class="token punctuation">{</span> <span class="token literal-property property">length</span><span class="token operator">:</span> pageSize <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">(</span><span class="token punctuation">{</span>
<span class="token literal-property property">title</span><span class="token operator">:</span> Random<span class="token punctuation">.</span><span class="token function">title</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token literal-property property">authorName</span><span class="token operator">:</span> Random<span class="token punctuation">.</span><span class="token function">cname</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token literal-property property">authorId</span><span class="token operator">:</span> Random<span class="token punctuation">.</span><span class="token function">name</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token literal-property property">createTime</span><span class="token operator">:</span> Date<span class="token punctuation">.</span><span class="token function">now</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token literal-property property">updateTime</span><span class="token operator">:</span> Date<span class="token punctuation">.</span><span class="token function">now</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token literal-property property">readCount</span><span class="token operator">:</span> Random<span class="token punctuation">.</span><span class="token function">integer</span><span class="token punctuation">(</span><span class="token number">60</span><span class="token punctuation">,</span> <span class="token number">1000</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token literal-property property">favoriteCount</span><span class="token operator">:</span> Random<span class="token punctuation">.</span><span class="token function">integer</span><span class="token punctuation">(</span><span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">50</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token literal-property property">postId</span><span class="token operator">:</span> <span class="token string">&#39;12323&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">serviceTag</span><span class="token operator">:</span> <span class="token string">&#39;业务类型&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">productTag</span><span class="token operator">:</span> <span class="token string">&#39;产品类型&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">requestTag</span><span class="token operator">:</span> <span class="token string">&#39;需求类型&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">handleTag</span><span class="token operator">:</span> <span class="token string">&#39;已采纳&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">postType</span><span class="token operator">:</span> <span class="token string">&#39;voice&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">postStatus</span><span class="token operator">:</span> isAudited <span class="token operator">?</span> <span class="token string">&#39;pass&#39;</span> <span class="token operator">:</span> <span class="token string">&#39;auditing&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">auditStatus</span><span class="token operator">:</span> <span class="token string">&#39;audit1&#39;</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// multipart/form-data 类型</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span><span class="token string">&#39;/v2/upload&#39;</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token parameter">req<span class="token punctuation">,</span> res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
res<span class="token punctuation">.</span><span class="token function">send</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
<span class="token literal-property property">code</span><span class="token operator">:</span> <span class="token string">&#39;0&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">msg</span><span class="token operator">:</span> <span class="token string">&#39;文件上传成功&#39;</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
</code></pre><div class="line-numbers" aria-hidden="true"><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 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 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 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 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><h3 id="cgimock-参数" tabindex="-1"><a class="header-anchor" href="#cgimock-参数" aria-hidden="true">#</a> cgiMock 参数</h3><p>创建一个 mock 接口，参数非常灵活，参考上面的 demo 即可。</p><h3 id="mockjs-参数" tabindex="-1"><a class="header-anchor" href="#mockjs-参数" aria-hidden="true">#</a> mockjs 参数</h3>`,12),d={href:"http://mockjs.com/",target:"_blank",rel:"noopener noreferrer"},v=a(`<p>比如：</p><div class="language-javascript line-numbers-mode" data-ext="js"><pre class="language-javascript"><code><span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter"><span class="token punctuation">{</span> cgiMock<span class="token punctuation">,</span> mockjs<span class="token punctuation">,</span> utils <span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token function">cgiMock</span><span class="token punctuation">(</span>
<span class="token string">&#39;/random&#39;</span><span class="token punctuation">,</span>
mockjs<span class="token punctuation">.</span><span class="token function">mock</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
<span class="token string-property property">&#39;string|1-10&#39;</span><span class="token operator">:</span> <span class="token string">&#39;★&#39;</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
</code></pre><div class="line-numbers" aria-hidden="true"><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><h3 id="utils-参数" tabindex="-1"><a class="header-anchor" href="#utils-参数" aria-hidden="true">#</a> utils 参数</h3><p>工具函数：</p><ul><li>utils.file(path)，从项目根目录根据 path 寻找文件，返回文件流。</li></ul><h2 id="配置-mock" tabindex="-1"><a class="header-anchor" href="#配置-mock" aria-hidden="true">#</a> 配置 Mock</h2>`,6),m=a(`<h2 id="关闭-mock" tabindex="-1"><a class="header-anchor" href="#关闭-mock" aria-hidden="true">#</a> 关闭 Mock</h2><p>可以通过配置关闭。</p><div class="language-javascript line-numbers-mode" data-ext="js"><pre class="language-javascript"><code><span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
<span class="token literal-property property">mock</span><span class="token operator">:</span> <span class="token boolean">false</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">;</span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div>`,3);function b(g,y){const e=p("ExternalLinkIcon"),o=p("RouterLink");return i(),l("div",null,[k,s("p",null,[s("a",d,[n("Mock.js"),t(e)]),n(" 是常用的辅助生成模拟数据的三方库，借助他可以提升我们的 mock 数据能力。")]),v,s("p",null,[n("详见配置 "),t(o,{to:"/reference/config/#mock"},{default:u(()=>[n("mock")]),_:1}),n("。")]),m])}const h=c(r,[["render",b],["__file","mock.html.vue"]]);export{h as default};
Reference in New Issue View Git Blame Copy Permalink