mirror of
https://github.com/WeBankFinTech/fes.js.git
synced 2025-04-06 03:59:53 +08:00
9 lines
3.2 KiB
JavaScript
9 lines
3.2 KiB
JavaScript
import{_ as t,o as e,c as n,f as a}from"./app.0e52fd78.js";const s={},o=a(`<h1 id="fesjs-plugin-icon" tabindex="-1"><a class="header-anchor" href="#fesjs-plugin-icon" aria-hidden="true">#</a> @fesjs/plugin-icon</h1><h2 id="介绍" tabindex="-1"><a class="header-anchor" href="#介绍" aria-hidden="true">#</a> 介绍</h2><p>提供以 <code>component</code> 的方式，直接使用 svg icon 的能力。</p><h2 id="启用方式" tabindex="-1"><a class="header-anchor" href="#启用方式" aria-hidden="true">#</a> 启用方式</h2><p>在 <code>package.json</code> 中引入依赖：</p><div class="language-json line-numbers-mode" data-ext="json"><pre class="language-json"><code><span class="token punctuation">{</span>
|
|
<span class="token property">"dependencies"</span><span class="token operator">:</span> <span class="token punctuation">{</span>
|
|
<span class="token property">"@fesjs/fes"</span><span class="token operator">:</span> <span class="token string">"^3.0.0"</span><span class="token punctuation">,</span>
|
|
<span class="token property">"@fesjs/plugin-icon"</span><span class="token operator">:</span> <span class="token string">"^3.0.0"</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></div><h2 id="使用" tabindex="-1"><a class="header-anchor" href="#使用" aria-hidden="true">#</a> 使用</h2><p>新建 <code>src/icons</code> 目录，将 svg 文件放入其中，在 <code>component</code> 中引用：</p><div class="language-jsx line-numbers-mode" data-ext="jsx"><pre class="language-jsx"><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>fes-icon</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>iconName<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>
|
|
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><h3 id="属性" tabindex="-1"><a class="header-anchor" href="#属性" aria-hidden="true">#</a> 属性</h3><table><thead><tr><th style="text-align:left;">属性</th><th style="text-align:left;">说明</th><th style="text-align:left;">类型</th></tr></thead><tbody><tr><td style="text-align:left;">type</td><td style="text-align:left;">svg 文件名</td><td style="text-align:left;"><code>string</code></td></tr><tr><td style="text-align:left;">spin</td><td style="text-align:left;">是否无限旋转</td><td style="text-align:left;"><code>boolean</code></td></tr><tr><td style="text-align:left;">rotate</td><td style="text-align:left;">旋转角度</td><td style="text-align:left;"><code>number</code></td></tr></tbody></table>`,11),l=[o];function i(c,d){return e(),n("div",null,l)}const r=t(s,[["render",i],["__file","icon.html.vue"]]);export{r as default};
|