| 1 |
- import{c as t,o as e,A as h}from"./vendor.91b30fe3.js";const n={class:"markdown-body"},d=h('<h1>switch组件</h1><h3>介绍</h3><p>用来打开或关闭选项。</p><h3>安装</h3><pre><code class="language-javascript">import { createApp } from 'vue';\nimport { Switch } from '@nutui/nutui';\n\nconst app = createApp();\napp.use(Switch);\n\n</code></pre><h2>代码演示</h2><h3>基础用法</h3><pre><code class="language-html"><nut-switch></nut-switch>\n</code></pre><h3>change事件</h3><pre><code class="language-html"><nut-switch @switch-change="change"></nut-switch>\n</code></pre><pre><code class="language-javascript">export default {\n setup() {\n const change = (event: Event, isOpen: boolean) => {\n console.log('触发了change事件,开关状态：', isOpen);\n };\n \n return {\n change\n };\n }\n};\n</code></pre><h3>自定义颜色</h3><pre><code class="language-html"><nut-switch activeColor="blue"></nut-switch>\n</code></pre><h2>API</h2><h3>Props</h3><table><thead><tr><th>参数</th><th>说明</th><th>类型</th><th>默认值</th></tr></thead><tbody><tr><td>status</td><td>开关状态</td><td>Boolean</td><td>true</td></tr><tr><td>activeColor</td><td>开关打开时的背景颜色</td><td>String</td><td>rgb(250,63,25,1)</td></tr><tr><td>inactiveColor</td><td>开关关闭时的背景颜色</td><td>String</td><td>rgba(235,235,235,1)</td></tr></tbody></table><h3>Events</h3><table><thead><tr><th>事件名</th><th>说明</th><th>回调参数</th></tr></thead><tbody><tr><td>switch-change</td><td>切换开关时触发</td><td>event: Event</td></tr></tbody></table>',18),a={expose:[],setup:h=>(h,a)=>(e(),t("div",n,[d]))};export default a;
|
