wot-design-uni/guide/common-problems.html

122 lines
109 KiB
HTML
Raw Permalink Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

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.

<!DOCTYPE html>
<html lang="zh-CN" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>常见问题 FAQ | Wot UI</title>
<meta name="description" content="一个参照wot-design打造的uni-app组件库">
<meta name="generator" content="VitePress v1.6.3">
<link rel="preload stylesheet" href="/assets/style.DE99STDd.css" as="style">
<link rel="preload stylesheet" href="/vp-icons.css" as="style">
<script type="module" src="/assets/app.Dbjtrbcu.js"></script>
<link rel="preload" href="/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/assets/chunks/theme.BptUtxMC.js">
<link rel="modulepreload" href="/assets/chunks/framework.C7RrxATG.js">
<link rel="modulepreload" href="/assets/guide_common-problems.md.DbBMHfw2.lean.js">
<link rel="icon" href="/favicon.ico">
<script>var _hmt=_hmt||[];(function(){var e=document.createElement("script");e.src="https://hm.baidu.com/hm.js?c77588a5308ea5813c1d46bdd849338b";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})();</script>
<script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
<script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
</head>
<body>
<div id="app"><div class="Layout" data-v-0265fbf3><!--[--><!----><!--]--><!--[--><span tabindex="-1" data-v-820c3f27></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-820c3f27>Skip to content</a><!--]--><!----><header class="VPNav" data-v-0265fbf3 data-v-17d76767><div class="VPNavBar has-sidebar top" data-v-17d76767 data-v-0850eeb5><div class="wrapper" data-v-0850eeb5><div class="container" data-v-0850eeb5><div class="title" data-v-0850eeb5><div class="VPNavBarTitle has-sidebar" data-v-0850eeb5 data-v-5efaa3d5><a class="title" href="/" data-v-5efaa3d5><!--[--><!--]--><!--[--><img class="VPImage logo" src="/logo.png" alt data-v-28aabeee><!--]--><span data-v-5efaa3d5>Wot UI</span><!--[--><!--[--><!--[--><!--[--><span class="el-tag el-tag--primary el-tag--small el-tag--plain" style="vertical-align:middle;margin-left:8px;" text><span class="el-tag__content"><!--[-->1.13.0<!--]--></span><!--v-if--></span><!--]--><!--]--><!--]--><!--]--></a></div></div><div class="content" data-v-0850eeb5><div class="content-body" data-v-0850eeb5><!--[--><!--]--><div class="VPNavBarSearch search" data-v-0850eeb5><!--[--><!----><div id="docsearch"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><span class="vp-icon DocSearch-Search-Icon"></span><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-0850eeb5 data-v-226f0211><span id="main-nav-aria-label" class="visually-hidden" data-v-226f0211> Main Navigation </span><!--[--><!--[--><div class="VPFlyout VPNavBarMenuGroup active" data-v-226f0211 data-v-276a3a8f><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-276a3a8f><span class="text" data-v-276a3a8f><!----><span data-v-276a3a8f>指南</span><span class="vpi-chevron-down text-icon" data-v-276a3a8f></span></span></button><div class="menu" data-v-276a3a8f><div class="VPMenu" data-v-276a3a8f data-v-6a9ff74b><div class="items" data-v-6a9ff74b><!--[--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/guide/introduction.html" data-v-796a4fac><!--[--><span data-v-796a4fac>介绍</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/guide/quick-use.html" data-v-796a4fac><!--[--><span data-v-796a4fac>快速上手</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/guide/cli-templates.html" data-v-796a4fac><!--[--><span data-v-796a4fac>脚手架与模板</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/guide/consultation.html" data-v-796a4fac><!--[--><span data-v-796a4fac>咨询服务</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/guide/custom-theme.html" data-v-796a4fac><!--[--><span data-v-796a4fac>定制主题</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link active" href="/guide/common-problems.html" data-v-796a4fac><!--[--><span data-v-796a4fac>常见问题</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/guide/locale.html" data-v-796a4fac><!--[--><span data-v-796a4fac>国际化</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/guide/changelog.html" data-v-796a4fac><!--[--><span data-v-796a4fac>更新日志</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/guide/cases.html" data-v-796a4fac><!--[--><span data-v-796a4fac>⭐ 案例</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/guide/join-group.html" data-v-796a4fac><!--[--><span data-v-796a4fac>加群沟通</span><!--]--></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-226f0211 data-v-276a3a8f><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-276a3a8f><span class="text" data-v-276a3a8f><!----><span data-v-276a3a8f>组件</span><span class="vpi-chevron-down text-icon" data-v-276a3a8f></span></span></button><div class="menu" data-v-276a3a8f><div class="VPMenu" data-v-276a3a8f data-v-6a9ff74b><div class="items" data-v-6a9ff74b><!--[--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/component/button.html" data-v-796a4fac><!--[--><span data-v-796a4fac>基础组件</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/component/pagination.html" data-v-796a4fac><!--[--><span data-v-796a4fac>导航组件</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/component/calendar.html" data-v-796a4fac><!--[--><span data-v-796a4fac>数据输入</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/component/action-sheet.html" data-v-796a4fac><!--[--><span data-v-796a4fac>反馈组件</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link" href="/component/badge.html" data-v-796a4fac><!--[--><span data-v-796a4fac>数据展示</span><!--]--></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/reward/reward.html" tabindex="0" data-v-226f0211 data-v-18672fa5><!--[--><span data-v-18672fa5>🥤一杯咖啡</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://blog.wot-ui.cn/" target="_blank" rel="noreferrer" tabindex="0" data-v-226f0211 data-v-18672fa5><!--[--><span data-v-18672fa5>博客</span><!--]--></a><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-226f0211 data-v-276a3a8f><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-276a3a8f><span class="text" data-v-276a3a8f><!----><span data-v-276a3a8f>模板</span><span class="vpi-chevron-down text-icon" data-v-276a3a8f></span></span></button><div class="menu" data-v-276a3a8f><div class="VPMenu" data-v-276a3a8f data-v-6a9ff74b><div class="items" data-v-6a9ff74b><!--[--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link vp-external-link-icon" href="https://starter.wot-ui.cn/" target="_blank" rel="noreferrer" data-v-796a4fac><!--[--><span data-v-796a4fac>快速上手模板 wot-starter</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link vp-external-link-icon" href="https://vitesse-docs.netlify.app/" target="_blank" rel="noreferrer" data-v-796a4fac><!--[--><span data-v-796a4fac>vitesse-uni-app</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link vp-external-link-icon" href="https://github.com/wot-ui/wot-starter-retail" target="_blank" rel="noreferrer" data-v-796a4fac><!--[--><span data-v-796a4fac>wot-starter-retail</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link vp-external-link-icon" href="https://unibest.tech/" target="_blank" rel="noreferrer" data-v-796a4fac><!--[--><span data-v-796a4fac>unibest</span><!--]--></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-226f0211 data-v-276a3a8f><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-276a3a8f><span class="text" data-v-276a3a8f><!----><span data-v-276a3a8f>资源</span><span class="vpi-chevron-down text-icon" data-v-276a3a8f></span></span></button><div class="menu" data-v-276a3a8f><div class="VPMenu" data-v-276a3a8f data-v-6a9ff74b><div class="items" data-v-6a9ff74b><!--[--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link vp-external-link-icon" href="https://starter.wot-ui.cn/" target="_blank" rel="noreferrer" data-v-796a4fac><!--[--><span data-v-796a4fac>快速上手模板</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link vp-external-link-icon" href="https://marketplace.visualstudio.com/items?itemName=wot-ui.wot-ui-intellisense" target="_blank" rel="noreferrer" data-v-796a4fac><!--[--><span data-v-796a4fac>VS Code 代码提示插件</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link vp-external-link-icon" href="https://moonofweisheng.github.io/uni-mini-router/" target="_blank" rel="noreferrer" data-v-796a4fac><!--[--><span data-v-796a4fac>Vue3 uni-app路由库</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link vp-external-link-icon" href="https://github.com/Moonofweisheng/uni-mini-ci" target="_blank" rel="noreferrer" data-v-796a4fac><!--[--><span data-v-796a4fac>多平台小程序CI工具</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link vp-external-link-icon" href="https://uni-helper.js.org/" target="_blank" rel="noreferrer" data-v-796a4fac><!--[--><span data-v-796a4fac>Uni Helper</span><!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-6a9ff74b data-v-796a4fac><a class="VPLink link vp-external-link-icon" href="https://github.com/uni-ku" target="_blank" rel="noreferrer" data-v-796a4fac><!--[--><span data-v-796a4fac>uni-ku</span><!--]--></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--]--></nav><div class="VPFlyout VPNavBarTranslations translations" data-v-0850eeb5 data-v-c7b0e7c4 data-v-276a3a8f><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="Change language" data-v-276a3a8f><span class="text" data-v-276a3a8f><span class="vpi-languages option-icon" data-v-276a3a8f></span><!----><span class="vpi-chevron-down text-icon" data-v-276a3a8f></span></span></button><div class="menu" data-v-276a3a8f><div class="VPMenu" data-v-276a3a8f data-v-6a9ff74b><!----><!--[--><!--[--><div class="items" data-v-c7b0e7c4><p class="title" data-v-c7b0e7c4>简体中文</p><!--[--><div class="VPMenuLink" data-v-c7b0e7c4 data-v-796a4fac><a class="VPLink link" href="/en-US/guide/common-problems.html" data-v-796a4fac><!--[--><span data-v-796a4fac>English</span><!--]--></a></div><!--]--></div><!--]--><!--]--></div></div></div><div class="VPNavBarAppearance appearance" data-v-0850eeb5 data-v-7042c56b><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="Switch to dark theme" aria-checked="false" data-v-7042c56b data-v-c7ba4725 data-v-5c03db5c><span class="check" data-v-5c03db5c><span class="icon" data-v-5c03db5c><!--[--><span class="vpi-sun sun" data-v-c7ba4725></span><span class="vpi-moon moon" data-v-c7ba4725></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-0850eeb5 data-v-39bcb251 data-v-c6225e3a><!--[--><a class="VPSocialLink no-icon" href="https://github.com/Moonofweisheng/wot-design-uni" aria-label="github" target="_blank" rel="noopener" data-v-c6225e3a data-v-b26fdbba><span class="vpi-social-github"></span></a><a class="VPSocialLink no-icon" href="https://gitee.com/wot-design-uni/wot-design-uni" aria-label="Gitee" target="_blank" rel="noopener" data-v-c6225e3a data-v-b26fdbba><svg t="1692699544299" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4184" width="200" height="200"><path d="M512 1024C230.4 1024 0 793.6 0 512S230.4 0 512 0s512 230.4 512 512-230.4 512-512 512z m259.2-569.6H480c-12.8 0-25.6 12.8-25.6 25.6v64c0 12.8 12.8 25.6 25.6 25.6h176c12.8 0 25.6 12.8 25.6 25.6v12.8c0 41.6-35.2 76.8-76.8 76.8h-240c-12.8 0-25.6-12.8-25.6-25.6V416c0-41.6 35.2-76.8 76.8-76.8h355.2c12.8 0 25.6-12.8 25.6-25.6v-64c0-12.8-12.8-25.6-25.6-25.6H416c-105.6 0-188.8 86.4-188.8 188.8V768c0 12.8 12.8 25.6 25.6 25.6h374.4c92.8 0 169.6-76.8 169.6-169.6v-144c0-12.8-12.8-25.6-25.6-25.6z" fill="#6D6D72" p-id="4185"></path></svg></a><a class="VPSocialLink no-icon" href="/guide/join-group" aria-label="QQ" target="_blank" rel="noopener" data-v-c6225e3a data-v-b26fdbba><svg t="1694688365239" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4048" width="200" height="200"><path d="M980.79827 694.105946c-21.144216-122.796973-109.844757-203.250162-109.844757-203.250162 12.647784-111.477622-33.792-131.26573-33.792-131.26573C827.392 14.668108 530.985514 20.67373 524.730811 20.839784 518.476108 20.67373 222.01427 14.668108 212.300108 359.590054c0 0-46.467459 19.788108-33.819676 131.26573 0 0-88.700541 80.453189-109.817081 203.250162 0 0-11.291676 207.484541 101.403676 25.40627 0 0 25.350919 69.161514 71.790703 131.26573 0 0-83.082378 28.256865-75.997405 101.625081 0 0-2.87827 81.836973 177.401081 76.218811 0 0 126.699243-9.852541 164.753297-63.515676l16.605405 0 0.276757 0 16.633081 0c38.026378 53.635459 164.725622 63.515676 164.725622 63.515676 180.224 5.618162 177.401081-76.218811 177.401081-76.218811 7.029622-73.368216-75.997405-101.625081-75.997405-101.625081 46.439784-62.104216 71.790703-131.26573 71.790703-131.26573C992.034595 901.590486 980.79827 694.105946 980.79827 694.105946z" p-id="4049" fill="#6D6D72"></path></svg></a><a class="VPSocialLink no-icon" href="https://juejin.cn/user/26044011388510/posts" aria-label target="_blank" rel="noopener" data-v-c6225e3a data-v-b26fdbba><svg t="1758594913114" class="icon" viewBox="0 0 1316 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5329" width="200" height="200"><path d="M643.181714 247.698286l154.916572-123.172572L643.181714 0.256 643.072 0l-154.660571 124.269714 154.660571 123.245715 0.109714 0.182857z m0 388.461714h0.109715l399.579428-315.245714-108.361143-87.04-291.218285 229.888h-0.146286l-0.109714 0.146285L351.817143 234.093714l-108.251429 87.04 399.433143 315.136 0.146286-0.146285z m-0.146285 215.552l0.146285-0.146286 534.893715-422.034285 108.397714 87.04-243.309714 192L643.145143 1024 10.422857 525.056 0 516.754286l108.251429-86.893715L643.035429 851.748571z" fill="#1E80FF" p-id="5330"></path></svg></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-0850eeb5 data-v-f234b936 data-v-276a3a8f><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-276a3a8f><span class="vpi-more-horizontal icon" data-v-276a3a8f></span></button><div class="menu" data-v-276a3a8f><div class="VPMenu" data-v-276a3a8f data-v-6a9ff74b><!----><!--[--><!--[--><div class="group translations" data-v-f234b936><p class="trans-title" data-v-f234b936>简体中文</p><!--[--><div class="VPMenuLink" data-v-f234b936 data-v-796a4fac><a class="VPLink link" href="/en-US/guide/common-problems.html" data-v-796a4fac><!--[--><span data-v-796a4fac>English</span><!--]--></a></div><!--]--></div><div class="group" data-v-f234b936><div class="item appearance" data-v-f234b936><p class="label" data-v-f234b936>Appearance</p><div class="appearance-action" data-v-f234b936><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="Switch to dark theme" aria-checked="false" data-v-f234b936 data-v-c7ba4725 data-v-5c03db5c><span class="check" data-v-5c03db5c><span class="icon" data-v-5c03db5c><!--[--><span class="vpi-sun sun" data-v-c7ba4725></span><span class="vpi-moon moon" data-v-c7ba4725></span><!--]--></span></span></button></div></div></div><div class="group" data-v-f234b936><div class="item social-links" data-v-f234b936><div class="VPSocialLinks social-links-list" data-v-f234b936 data-v-c6225e3a><!--[--><a class="VPSocialLink no-icon" href="https://github.com/Moonofweisheng/wot-design-uni" aria-label="github" target="_blank" rel="noopener" data-v-c6225e3a data-v-b26fdbba><span class="vpi-social-github"></span></a><a class="VPSocialLink no-icon" href="https://gitee.com/wot-design-uni/wot-design-uni" aria-label="Gitee" target="_blank" rel="noopener" data-v-c6225e3a data-v-b26fdbba><svg t="1692699544299" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4184" width="200" height="200"><path d="M512 1024C230.4 1024 0 793.6 0 512S230.4 0 512 0s512 230.4 512 512-230.4 512-512 512z m259.2-569.6H480c-12.8 0-25.6 12.8-25.6 25.6v64c0 12.8 12.8 25.6 25.6 25.6h176c12.8 0 25.6 12.8 25.6 25.6v12.8c0 41.6-35.2 76.8-76.8 76.8h-240c-12.8 0-25.6-12.8-25.6-25.6V416c0-41.6 35.2-76.8 76.8-76.8h355.2c12.8 0 25.6-12.8 25.6-25.6v-64c0-12.8-12.8-25.6-25.6-25.6H416c-105.6 0-188.8 86.4-188.8 188.8V768c0 12.8 12.8 25.6 25.6 25.6h374.4c92.8 0 169.6-76.8 169.6-169.6v-144c0-12.8-12.8-25.6-25.6-25.6z" fill="#6D6D72" p-id="4185"></path></svg></a><a class="VPSocialLink no-icon" href="/guide/join-group" aria-label="QQ" target="_blank" rel="noopener" data-v-c6225e3a data-v-b26fdbba><svg t="1694688365239" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4048" width="200" height="200"><path d="M980.79827 694.105946c-21.144216-122.796973-109.844757-203.250162-109.844757-203.250162 12.647784-111.477622-33.792-131.26573-33.792-131.26573C827.392 14.668108 530.985514 20.67373 524.730811 20.839784 518.476108 20.67373 222.01427 14.668108 212.300108 359.590054c0 0-46.467459 19.788108-33.819676 131.26573 0 0-88.700541 80.453189-109.817081 203.250162 0 0-11.291676 207.484541 101.403676 25.40627 0 0 25.350919 69.161514 71.790703 131.26573 0 0-83.082378 28.256865-75.997405 101.625081 0 0-2.87827 81.836973 177.401081 76.218811 0 0 126.699243-9.852541 164.753297-63.515676l16.605405 0 0.276757 0 16.633081 0c38.026378 53.635459 164.725622 63.515676 164.725622 63.515676 180.224 5.618162 177.401081-76.218811 177.401081-76.218811 7.029622-73.368216-75.997405-101.625081-75.997405-101.625081 46.439784-62.104216 71.790703-131.26573 71.790703-131.26573C992.034595 901.590486 980.79827 694.105946 980.79827 694.105946z" p-id="4049" fill="#6D6D72"></path></svg></a><a class="VPSocialLink no-icon" href="https://juejin.cn/user/26044011388510/posts" aria-label target="_blank" rel="noopener" data-v-c6225e3a data-v-b26fdbba><svg t="1758594913114" class="icon" viewBox="0 0 1316 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5329" width="200" height="200"><path d="M643.181714 247.698286l154.916572-123.172572L643.181714 0.256 643.072 0l-154.660571 124.269714 154.660571 123.245715 0.109714 0.182857z m0 388.461714h0.109715l399.579428-315.245714-108.361143-87.04-291.218285 229.888h-0.146286l-0.109714 0.146285L351.817143 234.093714l-108.251429 87.04 399.433143 315.136 0.146286-0.146285z m-0.146285 215.552l0.146285-0.146286 534.893715-422.034285 108.397714 87.04-243.309714 192L643.145143 1024 10.422857 525.056 0 516.754286l108.251429-86.893715L643.035429 851.748571z" fill="#1E80FF" p-id="5330"></path></svg></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-0850eeb5 data-v-1f90b587><span class="container" data-v-1f90b587><span class="top" data-v-1f90b587></span><span class="middle" data-v-1f90b587></span><span class="bottom" data-v-1f90b587></span></span></button></div></div></div></div><div class="divider" data-v-0850eeb5><div class="divider-line" data-v-0850eeb5></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-0265fbf3 data-v-18b98bac><div class="container" data-v-18b98bac><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-18b98bac><span class="vpi-align-left menu-icon" data-v-18b98bac></span><span class="menu-text" data-v-18b98bac>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-18b98bac data-v-4d5c8a58><button data-v-4d5c8a58>Return to top</button><!----></div></div></div><aside class="VPSidebar" data-v-0265fbf3 data-v-87cf4cbd><div class="curtain" data-v-87cf4cbd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-87cf4cbd><span class="visually-hidden" id="sidebar-aria-label" data-v-87cf4cbd> Sidebar Navigation </span><!--[--><!--]--><!--[--><!----><!--]--><!--[--><div class="no-transition group" data-v-0bf2ac23><section class="VPSidebarItem level-0 has-active" data-v-0bf2ac23 data-v-af6982fc><!----><div class="items" data-v-af6982fc><!--[--><div class="VPSidebarItem level-1 is-link" data-v-af6982fc data-v-af6982fc><div class="item" data-v-af6982fc><div class="indicator" data-v-af6982fc></div><a class="VPLink link link" href="/guide/introduction.html" data-v-af6982fc><!--[--><p class="text" data-v-af6982fc>介绍 <!----></p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-af6982fc data-v-af6982fc><div class="item" data-v-af6982fc><div class="indicator" data-v-af6982fc></div><a class="VPLink link link" href="/guide/quick-use.html" data-v-af6982fc><!--[--><p class="text" data-v-af6982fc>快速上手 <!----></p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-af6982fc data-v-af6982fc><div class="item" data-v-af6982fc><div class="indicator" data-v-af6982fc></div><a class="VPLink link link" href="/guide/cli-templates.html" data-v-af6982fc><!--[--><p class="text" data-v-af6982fc>脚手架与模板 <!----></p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-af6982fc data-v-af6982fc><div class="item" data-v-af6982fc><div class="indicator" data-v-af6982fc></div><a class="VPLink link link" href="/guide/consultation.html" data-v-af6982fc><!--[--><p class="text" data-v-af6982fc>咨询服务 <!----></p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-af6982fc data-v-af6982fc><div class="item" data-v-af6982fc><div class="indicator" data-v-af6982fc></div><a class="VPLink link link" href="/guide/custom-theme.html" data-v-af6982fc><!--[--><p class="text" data-v-af6982fc>定制主题 <!----></p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-af6982fc data-v-af6982fc><div class="item" data-v-af6982fc><div class="indicator" data-v-af6982fc></div><a class="VPLink link link" href="/guide/locale.html" data-v-af6982fc><!--[--><p class="text" data-v-af6982fc>国际化 <!----></p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-af6982fc data-v-af6982fc><div class="item" data-v-af6982fc><div class="indicator" data-v-af6982fc></div><a class="VPLink link link" href="/guide/common-problems.html" data-v-af6982fc><!--[--><p class="text" data-v-af6982fc>常见问题 <!----></p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-af6982fc data-v-af6982fc><div class="item" data-v-af6982fc><div class="indicator" data-v-af6982fc></div><a class="VPLink link link" href="/guide/changelog.html" data-v-af6982fc><!--[--><p class="text" data-v-af6982fc>更新日志 <!----></p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-af6982fc data-v-af6982fc><div class="item" data-v-af6982fc><div class="indicator" data-v-af6982fc></div><a class="VPLink link link" href="/guide/cases.html" data-v-af6982fc><!--[--><p class="text" data-v-af6982fc>⭐ 案例 <!----></p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-af6982fc data-v-af6982fc><div class="item" data-v-af6982fc><div class="indicator" data-v-af6982fc></div><a class="VPLink link link" href="/guide/join-group.html" data-v-af6982fc><!--[--><p class="text" data-v-af6982fc>加群沟通 <!----></p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-0265fbf3 data-v-735a7857><div class="VPDoc has-sidebar has-aside is-expanded" data-v-735a7857 data-v-fb66d0fe><!--[--><!--]--><div class="container" data-v-fb66d0fe><div class="aside" data-v-fb66d0fe><div class="aside-curtain" data-v-fb66d0fe></div><div class="aside-container" data-v-fb66d0fe><div class="aside-content" data-v-fb66d0fe><div class="VPDocAside" data-v-fb66d0fe data-v-bd7328b1><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-bd7328b1 data-v-8b66606c><div class="content" data-v-8b66606c><div class="outline-marker" data-v-8b66606c></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-8b66606c>On this page</div><ul class="VPDocOutlineItem root" data-v-8b66606c data-v-36869fd1><!--[--><!--]--></ul></div></nav><!--[--><!--[--><!--[--><!--[--><!--[--><div class="VPDocAsideSponsors"><a class="sponsors-aside-text" href="/reward/sponsor">赞助位</a><div class="VPSponsors vp-sponsor aside"><!----><!----><section class="vp-sponsor-section"><div class="VPSponsorsGrid vp-sponsor-grid xmini" data-vp-grid="1"><div class="vp-sponsor-grid-item"><a class="vp-sponsor-grid-link" href="/reward/sponsor" rel="sponsored noopener"><article class="vp-sponsor-grid-box"><span class="vp-sponsor-grid-text">成为赞助商</span></article></a></div></div></section></div></div><div class="wwads-container"><div class="wwads-cn wwads-vertical" data-id="372"></div></div><!----><!--]--><!--]--><!--]--><!--]--><!--]--><div class="spacer" data-v-bd7328b1></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-fb66d0fe><div class="content-container" data-v-fb66d0fe><!--[--><!--]--><main class="main" data-v-fb66d0fe><div style="position:relative;" class="vp-doc _guide_common-problems" data-v-fb66d0fe><div><h1 id="常见问题-faq" tabindex="-1">常见问题 FAQ <a class="header-anchor" href="#常见问题-faq" aria-label="Permalink to &quot;常见问题 FAQ&quot;"></a></h1><p>本节介绍在开发过程当中遇到的部分 <strong>常见问题</strong> 以及 <strong>解决办法</strong></p><h2 id="目前支持哪些平台" tabindex="-1">目前支持哪些平台? <a class="header-anchor" href="#目前支持哪些平台" aria-label="Permalink to &quot;目前支持哪些平台?&quot;"></a></h2><p>目前支持 微信小程序、支付宝小程序、钉钉小程序、H5、APP 等平台。</p><h2 id="有没有最佳实践分享" tabindex="-1">有没有最佳实践分享? <a class="header-anchor" href="#有没有最佳实践分享" aria-label="Permalink to &quot;有没有最佳实践分享?&quot;"></a></h2><p>有,可以关注我的公众号「不如摸鱼去」,也可以访问我的博客<a href="https://blog.wot-ui.cn/" target="_blank" rel="noreferrer">不如摸鱼去</a>,分享无数干货,等你来看。</p><h2 id="组件库有没有提供可以单独引入的组件" tabindex="-1">组件库有没有提供可以单独引入的组件? <a class="header-anchor" href="#组件库有没有提供可以单独引入的组件" aria-label="Permalink to &quot;组件库有没有提供可以单独引入的组件?&quot;"></a></h2><p>目前是没有的,首先在插件市场缺少<code>CI/CD</code>工具,无法实现自动化发布,维护一套单独引入的组件费时费力,其次组件库提供的安装方式均可以实现按需引入,所以是无需提供单独引入的组件的。</p><h2 id="如何开启暗黑模式" tabindex="-1">如何开启暗黑模式? <a class="header-anchor" href="#如何开启暗黑模式" aria-label="Permalink to &quot;如何开启暗黑模式?&quot;"></a></h2><p><code>Wot UI</code>支持深色模式、主题定制等能力,详见<a href="/component/config-provider.html">ConfigProvider 全局配置</a>组件。</p><h2 id="有没有技术交流群" tabindex="-1">有没有技术交流群? <a class="header-anchor" href="#有没有技术交流群" aria-label="Permalink to &quot;有没有技术交流群?&quot;"></a></h2><p>有! 可以加入<a href="/guide/join-group.html">Wot UI 互助群</a>,分享心得、交流体会。</p><h2 id="sass抛出大量错误和警告" tabindex="-1">Sass抛出大量错误和警告 <a class="header-anchor" href="#sass抛出大量错误和警告" aria-label="Permalink to &quot;Sass抛出大量错误和警告&quot;"></a></h2><p><code>Dart Sass 3.0.0</code> 废弃了一批API而组件库目前还未兼容因此请确保你的<code>sass</code>版本为<code>1.78.0</code>及之前的版本。可以通过以下命令安装指定版本:</p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-AgWYM" id="tab-W4Yd-gf" checked><label data-title="npm" for="tab-W4Yd-gf">npm</label><input type="radio" name="group-AgWYM" id="tab-Wa1X1wX"><label data-title="yarn" for="tab-Wa1X1wX">yarn</label><input type="radio" name="group-AgWYM" id="tab-9jTrS5v"><label data-title="pnpm" for="tab-9jTrS5v">pnpm</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> i</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> sass@1.78.0</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span></span></code></pre></div><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> sass@1.78.0</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span></span></code></pre></div><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> sass@1.78.0</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span></span></code></pre></div></div></div><h2 id="小程序样式隔离" tabindex="-1">小程序样式隔离 <a class="header-anchor" href="#小程序样式隔离" aria-label="Permalink to &quot;小程序样式隔离&quot;"></a></h2><h3 id="在页面中使用-wot-ui-组件时-可直接在页面的样式文件中覆盖样式" tabindex="-1">在页面中使用 Wot UI 组件时,可直接在页面的样式文件中覆盖样式 <a class="header-anchor" href="#在页面中使用-wot-ui-组件时-可直接在页面的样式文件中覆盖样式" aria-label="Permalink to &quot;在页面中使用 Wot UI 组件时,可直接在页面的样式文件中覆盖样式&quot;"></a></h3><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-button</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;primary&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;主要按钮&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">/* 页面样式 */</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">:deep(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">.wd-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">red</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> !important</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><h3 id="为什么在组件中无法覆盖组件库样式" tabindex="-1">为什么在组件中无法覆盖组件库样式? <a class="header-anchor" href="#为什么在组件中无法覆盖组件库样式" aria-label="Permalink to &quot;为什么在组件中无法覆盖组件库样式?&quot;"></a></h3><p>在自定义组件中使用 Wot UI 组件时,需开启<code>styleIsolation: &#39;shared&#39;</code>选项</p><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-button</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;primary&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;主要按钮&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><p><code>Vue 3.2</code> 及以下版本可以使用如下配置开启<code>styleIsolation: &#39;shared&#39;</code>选项:</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// vue</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">script lang</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;ts&quot;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> default</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> options: {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> styleIsolation: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;shared&#39;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;/</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">script</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">script lang</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;ts&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> setup</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;/</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">script</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span></code></pre></div><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">/* 组件样式 */</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">:deep(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">.wd-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">red</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> !important</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><p><code>Vue 3.3+</code> 可以通过<code>defineOptions</code>开启<code>styleIsolation: &#39;shared&#39;</code>选项:</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">script lang</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;ts&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> setup</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">defineOptions</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> options: {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> styleIsolation: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;shared&#39;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">})</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;/</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">script</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span></code></pre></div><h2 id="小程序使用外部样式类" tabindex="-1">小程序使用外部样式类 <a class="header-anchor" href="#小程序使用外部样式类" aria-label="Permalink to &quot;小程序使用外部样式类&quot;"></a></h2><p>Wot UI 开放了大量的自定义样式类供开发者使用,具体的样式类名称可查阅对应组件的“外部样式类”部分。需要注意的是普通样式类和自定义样式类的优先级是未定义的,因此使用时请添加<code>!important</code>以保证外部样式类的优先级。</p><div class="tip custom-block"><p class="custom-block-title">请注意</p><p><code>Wot UI</code> 的组件均设置了<code>scoped</code>,所以它的 CSS 只会影响当前组件的元素,和 Shadow DOM 中的样式封装类似,处于 <code>scoped</code> 样式中的选择器如果想要做更“深度”的选择,也即:影响到子组件,可以使用 <code>:deep()</code> 这个伪类:</p><div class="language-css vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> scoped</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">.a</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> :deep(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">.b</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 style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">style</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span></code></pre></div><p>上面的代码会被编译成:</p><div class="language-css vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">.a</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">[</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">data-v-f3f3eg9</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">] </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">.b</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></code></pre></div><p>详细可见<a href="https://cn.vuejs.org/api/sfc-css-features.html#sfc-css-features" target="_blank" rel="noreferrer">单文件组件 CSS 功能</a></p></div><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-button</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> custom-class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;custom-button&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;primary&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;主要按钮&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><div class="language-scss vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">scss</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">/* 组件样式 */</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">:deep(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">.custom-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">red</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> !important</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><h2 id="小程序自定义组件渲染问题" tabindex="-1">小程序自定义组件渲染问题 <a class="header-anchor" href="#小程序自定义组件渲染问题" aria-label="Permalink to &quot;小程序自定义组件渲染问题&quot;"></a></h2><p>微信/QQ/百度/抖音这四家小程序,自定义组件在渲染时会比 App/H5 端多一级节点,下面以<code>divider</code>组件举例:</p><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">&lt;!-- 使用 --&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-divider</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-divider</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">&lt;!-- h5渲染 --&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">view</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;wd-divider&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">view</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">&lt;!-- 微信小程序渲染 --&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-divider</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> &lt;view class=&quot;wd-divider&quot;&gt;&lt;/view&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-divider</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><h3 id="解决办法" tabindex="-1">解决办法 <a class="header-anchor" href="#解决办法" aria-label="Permalink to &quot;解决办法&quot;"></a></h3><p>在微信端可以使用<a href="https://uniapp.dcloud.net.cn/tutorial/vue-api.html#%E5%85%B6%E4%BB%96%E9%85%8D%E7%BD%AE" target="_blank" rel="noreferrer">virtualHost</a>解决,<code>virtualHost</code>设为<code>true</code>之后会将自定义节点设置成虚拟的,更加接近 Vue 组件的表现,可以去掉微信小程序自定义组件多出的最外层标签,启用后还可以通过 <a href="https://uniapp.dcloud.net.cn/collocation/manifest.html#mp-weixin" target="_blank" rel="noreferrer">mergeVirtualHostAttributes</a> 合并合并组件虚拟节点外层属性。</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// vue2使用virtualHost</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> default</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> data</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">() {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> options: {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> virtualHost: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// vue3 script setup 使用virtualHost</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">script lang</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;ts&quot;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> default</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> // 将自定义节点设置成虚拟的更加接近Vue组件的表现可以去掉微信小程序自定义组件多出的最外层标签</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> options: {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> virtualHost: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;/</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">script</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">script lang</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;ts&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> setup</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;/</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">script</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span></code></pre></div><h3 id="启用-virtualhost-效果" tabindex="-1">启用 virtualHost 效果 <a class="header-anchor" href="#启用-virtualhost-效果" aria-label="Permalink to &quot;启用 virtualHost 效果&quot;"></a></h3><p>这里我们还是以<code>divider</code>组件举例:</p><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">&lt;!-- 使用 --&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-divider</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-divider</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">&lt;!-- h5渲染 --&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">view</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;wd-divider&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">view</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">&lt;!-- 微信小程序渲染 --&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">view</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;wd-divider&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">view</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><h2 id="如何定制主题" tabindex="-1">如何定制主题? <a class="header-anchor" href="#如何定制主题" aria-label="Permalink to &quot;如何定制主题?&quot;"></a></h2><p>我们为每个组件提供了<code>css 变量</code>,可以参考<a href="./../component/config-provider.html">config-provider</a>组件的使用介绍来定制主题。</p><h2 id="toast-和-messagebox-组件调用无效果" tabindex="-1">Toast 和 MessageBox 组件调用无效果? <a class="header-anchor" href="#toast-和-messagebox-组件调用无效果" aria-label="Permalink to &quot;Toast 和 MessageBox 组件调用无效果?&quot;"></a></h2><p>首先要检查一下用法是否正确,<code>uni-app</code>平台不支持全局挂载组件,所以<code>Message</code><code>Toast</code>等组件仍需在 SFC 中显式使用,例如:</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-toast</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-toast</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><p><code>Message</code><code>Toast</code>的函数式调用是基于<code>provide/inject</code>实现的,所以你的调用要确保在<code>setup</code>中。</p><h2 id="编译到支付宝小程序-popup-组件的遮罩无法显示" tabindex="-1">编译到支付宝小程序 Popup 组件的遮罩无法显示? <a class="header-anchor" href="#编译到支付宝小程序-popup-组件的遮罩无法显示" aria-label="Permalink to &quot;编译到支付宝小程序 Popup 组件的遮罩无法显示?&quot;"></a></h2><p>uni-app 3.99.2023122704 将支付宝小程序的<code>styleIsolation</code>默认值设置为了<code>apply-shared</code>,而支付宝小程序默认的<code>styleIsolation</code><code>shared</code>,所以导致更新到<code>3.99.2023122704</code>版本后,支付宝小程序自定义组件样式穿透无法生效,参见<a href="https://ask.dcloud.net.cn/question/187142" target="_blank" rel="noreferrer">issue</a>。 解决办法:在<code>mainfest.json</code>中设置<code>styleIsolation</code><code>shared</code></p><div class="language-json vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">json</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><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:#005CC5;--shiki-dark:#79B8FF;"> &quot;mp-alipay&quot;</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:#005CC5;--shiki-dark:#79B8FF;"> &quot;styleIsolation&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;shared&quot;</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 style="--shiki-light:#6A737D;--shiki-dark:#6A737D;"> // ...</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><h2 id="为什么组件库文档中都是从-uni-modules-wot-design-uni导入方法和工具类" tabindex="-1">为什么组件库文档中都是从<code>@/uni_modules/wot-design-uni</code>导入方法和工具类? <a class="header-anchor" href="#为什么组件库文档中都是从-uni-modules-wot-design-uni导入方法和工具类" aria-label="Permalink to &quot;为什么组件库文档中都是从`@/uni_modules/wot-design-uni`导入方法和工具类?&quot;"></a></h2><p>当前组件库本身的开发方式是将组件库代码放到<code>@/uni_modules/wot-design-uni</code>这个目录的,所以文档中都是从<code>@/uni_modules/wot-design-uni</code>导入方法和工具类,使用<code>npm</code>方式安装组件库的时候可以这样调整:</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// useToast、useNotify等同理</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { useMessage } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;@/uni_modules/wot-design-uni&#39;</span></span></code></pre></div><p>替换为</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { useMessage } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;wot-design-uni&#39;</span></span></code></pre></div><h2 id="uni-app-如何自定义编译平台-例如钉钉小程序" tabindex="-1">uni-app 如何自定义编译平台,例如钉钉小程序? <a class="header-anchor" href="#uni-app-如何自定义编译平台-例如钉钉小程序" aria-label="Permalink to &quot;uni-app 如何自定义编译平台,例如钉钉小程序?&quot;"></a></h2><p>可以参考<code>uni-app</code>文档中<a href="https://uniapp.dcloud.net.cn/collocation/package.html#%E7%A4%BA%E4%BE%8B-%E9%92%89%E9%92%89%E5%B0%8F%E7%A8%8B%E5%BA%8F" target="_blank" rel="noreferrer">package.json</a>章节。</p><p>钉钉小程序示例:</p><div class="language-JSON vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">JSON</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> &quot;uni-app&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> &quot;scripts&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> &quot;mp-dingtalk&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> &quot;title&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;钉钉小程序&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> &quot;env&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> &quot;UNI_PLATFORM&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;mp-alipay&quot;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> &quot;define&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> &quot;MP-DINGTALK&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><h2 id="当前组件库提供的用于控制组件显示隐藏-hooks-不生效怎么办" tabindex="-1">当前组件库提供的用于控制组件显示隐藏 hooks 不生效怎么办? <a class="header-anchor" href="#当前组件库提供的用于控制组件显示隐藏-hooks-不生效怎么办" aria-label="Permalink to &quot;当前组件库提供的用于控制组件显示隐藏 hooks 不生效怎么办?&quot;"></a></h2><div class="tip custom-block"><p class="custom-block-title">注意</p><p>多次执行<code>use</code>后,<code>useToast</code><code>useMessage</code><code>useNotify</code><code>useQueue</code>等 hooks 不生效的问题已在1.3.14版本修复,请升级到最新版本。</p></div><p><strong><em>可以按照以下步骤进行排查</em></strong></p><ol><li><code>uni-app</code>平台不支持全局挂载组件,所以<code>Message</code><code>Toast</code><code>Notify</code>等组件需在 SFC 中显式使用,例如:</li></ol><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-toast</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-toast</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><ol start="2"><li><code>useToast</code><code>useMessage</code><code>useNotify</code><code>useQueue</code>等 hooks 不生效,请检查是否在<code>setup</code>中调用,如果<code>setup</code>中调用,请检查当前页面是否存在多次执行<code>use</code>的场景,例如在多个组件中执行,这样会导致上一次<code>use</code>的失效。针对此场景,组件的函数式调用都支持传入<code>selector</code>参数,可以通过<code>selector</code>参数来指定组件,例如:</li></ol><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-toast</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-toast</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-toast</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> selector</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;my-toast&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-toast</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> toast</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> useToast</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">()</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> myToast</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> useToast</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;my-toast&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span></code></pre></div><h2 id="为什么在微信小程序上使用popup、actionsheet、dropdownitem等弹出框组件包裹slider、tabs等组件时-slider、tabs表现异常" tabindex="-1">为什么在微信小程序上使用<code>Popup</code><code>ActionSheet</code><code>DropDownItem</code>等弹出框组件包裹<code>Slider</code><code>Tabs</code>等组件时,<code>Slider</code><code>Tabs</code>表现异常? <a class="header-anchor" href="#为什么在微信小程序上使用popup、actionsheet、dropdownitem等弹出框组件包裹slider、tabs等组件时-slider、tabs表现异常" aria-label="Permalink to &quot;为什么在微信小程序上使用`Popup`、`ActionSheet`、`DropDownItem`等弹出框组件包裹`Slider`、`Tabs`等组件时,`Slider`、`Tabs`表现异常?&quot;"></a></h2><p>目前uni-app使用<code>v-if</code>控制插槽是否显示编译到微信小程序端存在问题具体可以参考issue:<a href="https://github.com/dcloudio/uni-app/issues/4755" target="_blank" rel="noreferrer">4755</a><a href="https://github.com/dcloudio/uni-app/issues/4847" target="_blank" rel="noreferrer">4847</a>。而<code>Popup</code><code>ActionSheet</code><code>DropDownItem</code>恰好正是使用<code>v-if</code>控制插槽是否显示,所以会导致<code>Slider</code><code>Tabs</code>在未渲染时执行了相关生命周期。<code>Slider</code><code>Tabs</code>等组件的一些数据如<code>Slider</code>的宽度,<code>Tabs</code>的滑块位置等会在onMounted等生命周期进行获取此时这些数据将会存在异常。</p><p>解决办法:</p><ol><li><code>Slider</code><code>Tabs</code>等组件外部使用<code>v-if</code>控制弹框打开前不展示,例如:</li></ol><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-slider</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> v-if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;showSlider&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-slider</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><ol><li><code>Popup</code><code>ActionSheet</code><code>DropDownItem</code>等组件完全打开时的钩子中重新初始化<code>Slider</code><code>Tabs</code>组件,例如:</li></ol><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-popup</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;show&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> position</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;bottom&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> closable</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> custom-style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;height: 200px;&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> @after-enter</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;handleOpened&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-slider</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;value&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;slider&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-slider</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">wd-popup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> slider</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ref</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;">function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> handleOpened</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">() {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> slider.value</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">!</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">initSlider</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">()</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><h2 id="为何messagebox弹出了多个" tabindex="-1">为何messageBox弹出了多个 <a class="header-anchor" href="#为何messagebox弹出了多个" aria-label="Permalink to &quot;为何messageBox弹出了多个&quot;"></a></h2><p>检查一下弹出多个<code>messageBox</code>的页面是否存在多个相同<code>selector</code>或无<code>selector</code><code>&lt;wd-message-box&gt;&lt;/wd-message-box&gt;</code>标签(当前页面包括页面中使用的组件)。<code>toast</code>亦是同理,在子组件中使用<code>messageBox</code>等组件需要指定<code>selector</code>并确保<code>selector</code>唯一。</p><h2 id="toast、message、loading-等如何全局调用" tabindex="-1">Toast、Message、Loading 等如何全局调用? <a class="header-anchor" href="#toast、message、loading-等如何全局调用" aria-label="Permalink to &quot;Toast、Message、Loading 等如何全局调用?&quot;"></a></h2><p>全局调用方案见 <a href="https://starter.wot-ui.cn/guide/feedback.html" target="_blank" rel="noreferrer">wot-starter</a>,支持在路由导航守卫和网络请求拦截器等场景使用的可全局调用的反馈组件。</p><h2 id="如何快速解决你的问题" tabindex="-1">如何快速解决你的问题? <a class="header-anchor" href="#如何快速解决你的问题" aria-label="Permalink to &quot;如何快速解决你的问题?&quot;"></a></h2><p><a href="https://lug.ustc.edu.cn/wiki/doc/smart-questions/" target="_blank" rel="noreferrer">提问的智慧</a>,可以帮助你快速提出正确的问题,获得更快的解答。</p><h2 id="关于我们" tabindex="-1">关于我们 <a class="header-anchor" href="#关于我们" aria-label="Permalink to &quot;关于我们&quot;"></a></h2><p><strong>如果您的问题不在上述列表中或您有更好的建议,请联系我们 <a href="https://github.com/Moonofweisheng/wot-design-uni" target="_blank" rel="noreferrer">Moonofweisheng</a></strong></p></div></div><!----></main><footer class="VPDocFooter" data-v-fb66d0fe data-v-f286b101><!--[--><!--]--><div class="edit-info" data-v-f286b101><div class="edit-link" data-v-f286b101><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/Moonofweisheng/wot-design-uni/edit/master/docs/guide/common-problems.md" target="_blank" rel="noreferrer" data-v-f286b101><!--[--><span class="vpi-square-pen edit-link-icon" data-v-f286b101></span> 为此页提供修改建议<!--]--></a></div><div class="last-updated" data-v-f286b101><p class="VPLastUpdated" data-v-f286b101 data-v-29be4286>最后更新: <time datetime="2025-11-04T09:38:20.000Z" data-v-29be4286></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-f286b101><span class="visually-hidden" id="doc-footer-aria-label" data-v-f286b101>Pager</span><div class="pager" data-v-f286b101><a class="VPLink link pager-link prev" href="/guide/locale.html" data-v-f286b101><!--[--><span class="desc" data-v-f286b101>Previous page</span><span class="title" data-v-f286b101>国际化</span><!--]--></a></div><div class="pager" data-v-f286b101><a class="VPLink link pager-link next" href="/guide/changelog.html" data-v-f286b101><!--[--><span class="desc" data-v-f286b101>Next page</span><span class="title" data-v-f286b101>更新日志</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-0265fbf3 data-v-8c1e2209><div class="container" data-v-8c1e2209><p class="message" data-v-8c1e2209>Released under the MIT License.</p><p class="copyright" data-v-8c1e2209>Copyright © 2023-present weisheng</p></div></footer><!--[--><footer class="VPFooter has-sidebar" data-v-5241aff4><div class="container" data-v-5241aff4><p class="message" data-v-5241aff4>Released under the MIT License.</p><p class="copyright" data-v-5241aff4>Copyright © 2023-present weisheng</p></div></footer><!--]--></div></div>
<script>window.__VP_HASH_MAP__=JSON.parse("{\"component_action-sheet.md\":\"c1wk9iY0\",\"component_backtop.md\":\"ChjnCdXQ\",\"component_badge.md\":\"DHa9DmJP\",\"component_button.md\":\"DdPdDApy\",\"component_calendar-view.md\":\"By77yWTw\",\"component_calendar.md\":\"TPn3bVA7\",\"component_card.md\":\"DKYdUaSz\",\"component_cell.md\":\"B1CvrQYt\",\"component_checkbox.md\":\"BTN9YXJn\",\"component_circle.md\":\"C-NomEQu\",\"component_col-picker.md\":\"B7y2As-_\",\"component_collapse.md\":\"BqEW7fjt\",\"component_config-provider.md\":\"Cc9O2TFG\",\"component_count-down.md\":\"7AKR5r1_\",\"component_count-to.md\":\"DXWdmNx4\",\"component_curtain.md\":\"Bta-imfj\",\"component_datetime-picker-view.md\":\"rJ_XDCZt\",\"component_datetime-picker.md\":\"z0yCsYtN\",\"component_divider.md\":\"R4TdmO8i\",\"component_drop-menu.md\":\"C13tbRUp\",\"component_fab.md\":\"DImkhvpn\",\"component_floating-panel.md\":\"B7i2tAhS\",\"component_form.md\":\"CME-wnrf\",\"component_gap.md\":\"DIIJY1vb\",\"component_grid.md\":\"DkQoGrey\",\"component_icon.md\":\"BuHdjlZN\",\"component_img-cropper.md\":\"BqLT0gMm\",\"component_img.md\":\"D7sPPqXk\",\"component_index-bar.md\":\"BOkNzK1d\",\"component_input-number.md\":\"De7gihWB\",\"component_input.md\":\"DfDNMeI7\",\"component_keyboard.md\":\"BOsb0wk-\",\"component_layout.md\":\"DfTs5fy6\",\"component_loading.md\":\"IsQE3LX_\",\"component_loadmore.md\":\"CojhRRRt\",\"component_message-box.md\":\"C-1IPENS\",\"component_navbar.md\":\"CJu6jrqt\",\"component_notice-bar.md\":\"M5Td2nA8\",\"component_notify.md\":\"Bey59xX8\",\"component_number-keyboard.md\":\"CHSyxjdT\",\"component_overlay.md\":\"Cg9-6ocD\",\"component_pagination.md\":\"CDHiQxUl\",\"component_password-input.md\":\"072mSgvk\",\"component_picker-view.md\":\"Bai5gXeH\",\"component_picker.md\":\"DS6cN2sU\",\"component_popover.md\":\"A4pXDyWr\",\"component_popup.md\":\"BcRFloja\",\"component_progress.md\":\"Czp_wd4C\",\"component_radio.md\":\"DbJTnGS0\",\"component_rate.md\":\"C_WkdfIZ\",\"component_resize.md\":\"D8RZtXoR\",\"component_root-portal.md\":\"roOdXyJH\",\"component_search.md\":\"Mb8x7t2A\",\"component_segmented.md\":\"yzL4eQEM\",\"component_select-picker.md\":\"Bfsrlx9I\",\"component_sidebar.md\":\"DL1UgvVn\",\"component_signature.md\":\"DkbbyalD\",\"component_skeleton.md\":\"Cc_j76M_\",\"component_slider.md\":\"p6HGcIPe\",\"component_sort-button.md\":\"BD8z8Cve\",\"component_status-tip.md\":\"BvIC-tWU\",\"component_steps.md\":\"CGl3Ci6T\",\"component_sticky.md\":\"C_lGa15p\",\"component_swipe-action.md\":\"Be8RihFK\",\"component_swiper.md\":\"DaYLlpEs\",\"component_switch.md\":\"C0mqvZuH\",\"component_tabbar.md\":\"ydn44Av0\",\"component_table.md\":\"BkUxx66J\",\"component_tabs.md\":\"ZBLgX7sE\",\"component_tag.md\":\"Cah0fbm3\",\"component_text.md\":\"T9lTnVI5\",\"component_textarea.md\":\"CcwDxrKj\",\"component_toast.md\":\"BZuJA7Lz\",\"component_tooltip.md\":\"CC2aFIqN\",\"component_transition.md\":\"CkEHkk23\",\"component_upload.md\":\"XiFkl4kM\",\"component_use-count-down.md\":\"Xnxyrag0\",\"component_use-message.md\":\"BuGPPdHM\",\"component_use-notify.md\":\"BWojxxLU\",\"component_use-toast.md\":\"BZkuWk55\",\"component_use-upload.md\":\"Y-ZiqRcB\",\"component_watermark.md\":\"Cd26NJVG\",\"en-us_component_action-sheet.md\":\"Cd3U93mr\",\"en-us_component_backtop.md\":\"Bslz86Iq\",\"en-us_component_badge.md\":\"D8LazXDE\",\"en-us_component_button.md\":\"CnMVwqBn\",\"en-us_component_calendar-view.md\":\"iz4-bCKT\",\"en-us_component_calendar.md\":\"v2nB85ff\",\"en-us_component_card.md\":\"uC1up0ZK\",\"en-us_component_cell.md\":\"hIXxrdwM\",\"en-us_component_checkbox.md\":\"qBl_DsKh\",\"en-us_component_circle.md\":\"BPmZrds3\",\"en-us_component_col-picker.md\":\"BWRXToYb\",\"en-us_component_collapse.md\":\"LKD9aBUw\",\"en-us_component_config-provider.md\":\"CFNW3U-S\",\"en-us_component_count-down.md\":\"BJQiz0fk\",\"en-us_component_count-to.md\":\"D2-tcAxo\",\"en-us_component_curtain.md\":\"CpVzT501\",\"en-us_component_datetime-picker-view.md\":\"DRRyefaI\",\"en-us_component_datetime-picker.md\":\"viOfH4-D\",\"en-us_component_divider.md\":\"5yS4Zj7t\",\"en-us_component_drop-menu.md\":\"CjkACyIn\",\"en-us_component_fab.md\":\"BKrDynOW\",\"en-us_component_floating-panel.md\":\"BNdM3TAS\",\"en-us_component_form.md\":\"CmWlrhX2\",\"en-us_component_gap.md\":\"xHLZJiab\",\"en-us_component_grid.md\":\"BnbHrzpx\",\"en-us_component_icon.md\":\"ZGGzXqB0\",\"en-us_component_img-cropper.md\":\"NY3w0k-N\",\"en-us_component_img.md\":\"DJVBjNYz\",\"en-us_component_index-bar.md\":\"fF1C0kOD\",\"en-us_component_input-number.md\":\"CAZT25bO\",\"en-us_component_input.md\":\"DW5h1itn\",\"en-us_component_keyboard.md\":\"CodeGHFL\",\"en-us_component_layout.md\":\"rRHhIkkw\",\"en-us_component_loading.md\":\"B35WuME0\",\"en-us_component_loadmore.md\":\"D9kTaZhc\",\"en-us_component_message-box.md\":\"DrnZVwZp\",\"en-us_component_navbar.md\":\"BmlPgjvC\",\"en-us_component_notice-bar.md\":\"Cvr7wOv6\",\"en-us_component_notify.md\":\"Br3ccipV\",\"en-us_component_number-keyboard.md\":\"CaPQvUPH\",\"en-us_component_overlay.md\":\"zNxFtOQZ\",\"en-us_component_pagination.md\":\"DHm_Z8LN\",\"en-us_component_password-input.md\":\"C29XspiG\",\"en-us_component_picker-view.md\":\"a3X9EZkl\",\"en-us_component_picker.md\":\"CCw2hvXb\",\"en-us_component_popover.md\":\"BPLhDTIf\",\"en-us_component_popup.md\":\"BLOzydaK\",\"en-us_component_progress.md\":\"2cPjArIs\",\"en-us_component_radio.md\":\"BynGPD10\",\"en-us_component_rate.md\":\"D2Aaq0NP\",\"en-us_component_resize.md\":\"C3NcH4RM\",\"en-us_component_root-portal.md\":\"CTbe11FN\",\"en-us_component_search.md\":\"D8gdRsFB\",\"en-us_component_segmented.md\":\"DNjB96qJ\",\"en-us_component_select-picker.md\":\"7vfJz5YJ\",\"en-us_component_sidebar.md\":\"BgxPFXds\",\"en-us_component_signature.md\":\"D2eNXB2w\",\"en-us_component_skeleton.md\":\"Dgx_lV7y\",\"en-us_component_slider.md\":\"KcUCvn5T\",\"en-us_component_sort-button.md\":\"DHr8Lg6-\",\"en-us_component_status-tip.md\":\"PEI5mWsU\",\"en-us_component_steps.md\":\"C5tvS80n\",\"en-us_component_sticky.md\":\"DW-Nlnxa\",\"en-us_component_swipe-action.md\":\"DlVLtPzt\",\"en-us_component_swiper.md\":\"DS-UOAtN\",\"en-us_component_switch.md\":\"CoRdlYBi\",\"en-us_component_tabbar.md\":\"DrKNkzwJ\",\"en-us_component_table.md\":\"BUyeA4sa\",\"en-us_component_tabs.md\":\"DmdKyG-a\",\"en-us_component_tag.md\":\"BEcm8wa-\",\"en-us_component_text.md\":\"CZdJbtwW\",\"en-us_component_textarea.md\":\"56-Whl10\",\"en-us_component_toast.md\":\"BRSBm3RU\",\"en-us_component_tooltip.md\":\"C8DQf8H2\",\"en-us_component_transition.md\":\"C6DPrCEx\",\"en-us_component_upload.md\":\"BlVSsmpW\",\"en-us_component_use-count-down.md\":\"CyEqu1km\",\"en-us_component_use-message.md\":\"CMAz6nqd\",\"en-us_component_use-notify.md\":\"D0AjOFl5\",\"en-us_component_use-toast.md\":\"BV3WSzoK\",\"en-us_component_use-upload.md\":\"CBfVolaU\",\"en-us_component_watermark.md\":\"Do6ZpG1-\",\"en-us_guide_cases.md\":\"4dW2tPiK\",\"en-us_guide_changelog.md\":\"D1rlzokv\",\"en-us_guide_cli-templates.md\":\"4m4MEJdq\",\"en-us_guide_common-problems.md\":\"m7Th9aXD\",\"en-us_guide_custom-theme.md\":\"BPELFWuA\",\"en-us_guide_introduction.md\":\"C1I0pOjl\",\"en-us_guide_join-group.md\":\"DWJTm-4f\",\"en-us_guide_locale.md\":\"X5sYa5Eb\",\"en-us_guide_quick-use.md\":\"kNUqoGim\",\"en-us_guide_typography.md\":\"du5OecQa\",\"en-us_index.md\":\"BiPmfrlN\",\"en-us_reward_donor.md\":\"CFQu67rx\",\"en-us_reward_reward.md\":\"DtUfFX7-\",\"guide_cases.md\":\"CVhR7WpZ\",\"guide_changelog.md\":\"Cuc-ZOrl\",\"guide_cli-templates.md\":\"CjvCMsRJ\",\"guide_common-problems.md\":\"DbBMHfw2\",\"guide_consultation.md\":\"BLRMRi4o\",\"guide_custom-theme.md\":\"1nmxOJQd\",\"guide_introduction.md\":\"DvJU-z7D\",\"guide_join-group.md\":\"CGl14Eqc\",\"guide_locale.md\":\"CgE__xv0\",\"guide_quick-use.md\":\"BZt0nmeU\",\"guide_typography.md\":\"IvRl_D1k\",\"index.md\":\"DU4EjyMg\",\"reward_donor.md\":\"DeOBN5Sq\",\"reward_reward.md\":\"CfPFqJkK\",\"reward_sponsor.md\":\"C0P6i09I\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Wot UI\",\"description\":\"一个参照wot-design打造的uni-app组件库\",\"base\":\"/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"logo\":\"/logo.png\",\"lastUpdated\":{\"text\":\"最后更新\"},\"editLink\":{\"pattern\":\"https://github.com/Moonofweisheng/wot-design-uni/edit/master/docs/:path\",\"text\":\"为此页提供修改建议\"},\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/Moonofweisheng/wot-design-uni\"},{\"icon\":{\"svg\":\"<svg t=\\\"1692699544299\\\" class=\\\"icon\\\" viewBox=\\\"0 0 1024 1024\\\" version=\\\"1.1\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\" p-id=\\\"4184\\\" width=\\\"200\\\" height=\\\"200\\\"><path d=\\\"M512 1024C230.4 1024 0 793.6 0 512S230.4 0 512 0s512 230.4 512 512-230.4 512-512 512z m259.2-569.6H480c-12.8 0-25.6 12.8-25.6 25.6v64c0 12.8 12.8 25.6 25.6 25.6h176c12.8 0 25.6 12.8 25.6 25.6v12.8c0 41.6-35.2 76.8-76.8 76.8h-240c-12.8 0-25.6-12.8-25.6-25.6V416c0-41.6 35.2-76.8 76.8-76.8h355.2c12.8 0 25.6-12.8 25.6-25.6v-64c0-12.8-12.8-25.6-25.6-25.6H416c-105.6 0-188.8 86.4-188.8 188.8V768c0 12.8 12.8 25.6 25.6 25.6h374.4c92.8 0 169.6-76.8 169.6-169.6v-144c0-12.8-12.8-25.6-25.6-25.6z\\\" fill=\\\"#6D6D72\\\" p-id=\\\"4185\\\"></path></svg>\"},\"link\":\"https://gitee.com/wot-design-uni/wot-design-uni\",\"ariaLabel\":\"Gitee\"},{\"icon\":{\"svg\":\"<svg t=\\\"1694688365239\\\" class=\\\"icon\\\" viewBox=\\\"0 0 1024 1024\\\" version=\\\"1.1\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\" p-id=\\\"4048\\\" width=\\\"200\\\" height=\\\"200\\\"><path d=\\\"M980.79827 694.105946c-21.144216-122.796973-109.844757-203.250162-109.844757-203.250162 12.647784-111.477622-33.792-131.26573-33.792-131.26573C827.392 14.668108 530.985514 20.67373 524.730811 20.839784 518.476108 20.67373 222.01427 14.668108 212.300108 359.590054c0 0-46.467459 19.788108-33.819676 131.26573 0 0-88.700541 80.453189-109.817081 203.250162 0 0-11.291676 207.484541 101.403676 25.40627 0 0 25.350919 69.161514 71.790703 131.26573 0 0-83.082378 28.256865-75.997405 101.625081 0 0-2.87827 81.836973 177.401081 76.218811 0 0 126.699243-9.852541 164.753297-63.515676l16.605405 0 0.276757 0 16.633081 0c38.026378 53.635459 164.725622 63.515676 164.725622 63.515676 180.224 5.618162 177.401081-76.218811 177.401081-76.218811 7.029622-73.368216-75.997405-101.625081-75.997405-101.625081 46.439784-62.104216 71.790703-131.26573 71.790703-131.26573C992.034595 901.590486 980.79827 694.105946 980.79827 694.105946z\\\" p-id=\\\"4049\\\" fill=\\\"#6D6D72\\\"></path></svg>\"},\"link\":\"/guide/join-group\",\"ariaLabel\":\"QQ\"},{\"icon\":{\"svg\":\"<svg t=\\\"1758594913114\\\" class=\\\"icon\\\" viewBox=\\\"0 0 1316 1024\\\" version=\\\"1.1\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\" p-id=\\\"5329\\\" width=\\\"200\\\" height=\\\"200\\\"><path d=\\\"M643.181714 247.698286l154.916572-123.172572L643.181714 0.256 643.072 0l-154.660571 124.269714 154.660571 123.245715 0.109714 0.182857z m0 388.461714h0.109715l399.579428-315.245714-108.361143-87.04-291.218285 229.888h-0.146286l-0.109714 0.146285L351.817143 234.093714l-108.251429 87.04 399.433143 315.136 0.146286-0.146285z m-0.146285 215.552l0.146285-0.146286 534.893715-422.034285 108.397714 87.04-243.309714 192L643.145143 1024 10.422857 525.056 0 516.754286l108.251429-86.893715L643.035429 851.748571z\\\" fill=\\\"#1E80FF\\\" p-id=\\\"5330\\\"></path></svg>\"},\"link\":\"https://juejin.cn/user/26044011388510/posts\"}],\"search\":{\"provider\":\"algolia\",\"options\":{\"appId\":\"A74X2RFXSU\",\"apiKey\":\"6961856d63f5181bf71cb4fa3e4398d2\",\"indexName\":\"wot-design-uni2\"}},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2023-present weisheng\"}},\"locales\":{\"root\":{\"label\":\"简体中文\",\"lang\":\"zh-CN\",\"description\":\"一个参照wot-design打造的uni-app组件库\",\"themeConfig\":{\"lastUpdated\":{\"text\":\"最后更新\"},\"editLink\":{\"pattern\":\"https://github.com/Moonofweisheng/wot-design-uni/edit/master/docs/:path\",\"text\":\"为此页提供修改建议\"},\"nav\":[{\"text\":\"指南\",\"activeMatch\":\"/guide/\",\"items\":[{\"text\":\"介绍\",\"link\":\"/guide/introduction\"},{\"text\":\"快速上手\",\"link\":\"/guide/quick-use\"},{\"text\":\"脚手架与模板\",\"link\":\"/guide/cli-templates\"},{\"text\":\"咨询服务\",\"link\":\"/guide/consultation\"},{\"text\":\"定制主题\",\"link\":\"/guide/custom-theme\"},{\"text\":\"常见问题\",\"link\":\"/guide/common-problems\"},{\"text\":\"国际化\",\"link\":\"/guide/locale\"},{\"text\":\"更新日志\",\"link\":\"/guide/changelog\"},{\"text\":\"⭐ 案例\",\"link\":\"/guide/cases\"},{\"text\":\"加群沟通\",\"link\":\"/guide/join-group\"}]},{\"text\":\"组件\",\"activeMatch\":\"/component/\",\"items\":[{\"text\":\"基础组件\",\"link\":\"/component/button\"},{\"text\":\"导航组件\",\"link\":\"/component/pagination\"},{\"text\":\"数据输入\",\"link\":\"/component/calendar\"},{\"text\":\"反馈组件\",\"link\":\"/component/action-sheet\"},{\"text\":\"数据展示\",\"link\":\"/component/badge\"}]},{\"text\":\"🥤一杯咖啡\",\"link\":\"/reward/reward\",\"activeMatch\":\"/reward/\"},{\"text\":\"博客\",\"link\":\"https://blog.wot-ui.cn/\"},{\"text\":\"模板\",\"items\":[{\"text\":\"快速上手模板 wot-starter\",\"link\":\"https://starter.wot-ui.cn/\"},{\"text\":\"vitesse-uni-app\",\"link\":\"https://vitesse-docs.netlify.app/\"},{\"text\":\"wot-starter-retail\",\"link\":\"https://github.com/wot-ui/wot-starter-retail\"},{\"text\":\"unibest\",\"link\":\"https://unibest.tech/\"}]},{\"text\":\"资源\",\"items\":[{\"text\":\"快速上手模板\",\"link\":\"https://starter.wot-ui.cn/\"},{\"text\":\"VS Code 代码提示插件\",\"link\":\"https://marketplace.visualstudio.com/items?itemName=wot-ui.wot-ui-intellisense\"},{\"text\":\"Vue3 uni-app路由库\",\"link\":\"https://moonofweisheng.github.io/uni-mini-router/\"},{\"text\":\"多平台小程序CI工具\",\"link\":\"https://github.com/Moonofweisheng/uni-mini-ci\"},{\"text\":\"Uni Helper\",\"link\":\"https://uni-helper.js.org/\"},{\"text\":\"uni-ku\",\"link\":\"https://github.com/uni-ku\"}]}],\"sidebar\":{\"/guide/\":[{\"text\":\"介绍\",\"link\":\"/guide/introduction\"},{\"text\":\"快速上手\",\"link\":\"/guide/quick-use\"},{\"text\":\"脚手架与模板\",\"link\":\"/guide/cli-templates\"},{\"text\":\"咨询服务\",\"link\":\"/guide/consultation\"},{\"text\":\"定制主题\",\"link\":\"/guide/custom-theme\"},{\"text\":\"国际化\",\"link\":\"/guide/locale\"},{\"text\":\"常见问题\",\"link\":\"/guide/common-problems\"},{\"text\":\"更新日志\",\"link\":\"/guide/changelog\"},{\"text\":\"⭐ 案例\",\"link\":\"/guide/cases\"},{\"text\":\"加群沟通\",\"link\":\"/guide/join-group\"}],\"/reward/\":[{\"text\":\"🥤一杯咖啡\",\"link\":\"/reward/reward\"},{\"text\":\"榜上有名\",\"link\":\"/reward/donor\"},{\"text\":\"成为赞助者\",\"link\":\"/reward/sponsor\"}],\"/component/\":[{\"text\":\"基础\",\"collapsed\":false,\"items\":[{\"link\":\"/component/button\",\"text\":\"Button 按钮\"},{\"link\":\"/component/icon\",\"text\":\"Icon 图标\"},{\"link\":\"/component/layout\",\"text\":\"Layout 布局\"},{\"link\":\"/component/config-provider\",\"text\":\"ConfigProvider 全局配置\"},{\"link\":\"/component/popup\",\"text\":\"Popup 弹出层\"},{\"link\":\"/component/resize\",\"text\":\"Resize 监听元素尺寸变化\"},{\"link\":\"/component/transition\",\"text\":\"Transition 动画\"},{\"link\":\"/component/fab\",\"text\":\"Fab 悬浮按钮\"},{\"link\":\"/component/text\",\"text\":\"Text 文本\"},{\"link\":\"/component/root-portal\",\"text\":\"RootPortal 根节点\"}]},{\"text\":\"导航\",\"collapsed\":false,\"items\":[{\"link\":\"/component/pagination\",\"text\":\"Pagination 分页\"},{\"link\":\"/component/popover\",\"text\":\"Popover 气泡\"},{\"link\":\"/component/tabs\",\"text\":\"Tabs 标签页\"},{\"link\":\"/component/segmented\",\"text\":\"Segmented 分段器\"},{\"link\":\"/component/tabbar\",\"text\":\"Tabbar 标签栏\"},{\"link\":\"/component/navbar\",\"text\":\"Navbar 导航栏\"},{\"link\":\"/component/sidebar\",\"text\":\"Sidebar 侧边栏\"},{\"link\":\"/component/backtop\",\"text\":\"Backtop 回到顶部\"},{\"link\":\"/component/index-bar\",\"text\":\"IndexBar 索引栏\"}]},{\"text\":\"数据输入\",\"collapsed\":false,\"items\":[{\"link\":\"/component/calendar\",\"text\":\"Calendar 日历选择器\"},{\"link\":\"/component/calendar-view\",\"text\":\"CalendarView 日历面板\"},{\"link\":\"/component/checkbox\",\"text\":\"Checkbox 复选框\"},{\"link\":\"/component/col-picker\",\"text\":\"ColPicker 多列选择器\"},{\"link\":\"/component/datetime-picker\",\"text\":\"DatetimePicker 时间选择器\"},{\"link\":\"/component/datetime-picker-view\",\"text\":\"DatetimePickerView 时间选择器视图\"},{\"link\":\"/component/form\",\"text\":\"Form 表单\"},{\"link\":\"/component/input\",\"text\":\"Input 输入框\"},{\"link\":\"/component/textarea\",\"text\":\"Textarea 文本域\"},{\"link\":\"/component/input-number\",\"text\":\"InputNumber 计数器\"},{\"link\":\"/component/picker\",\"text\":\"Picker 选择器\"},{\"link\":\"/component/picker-view\",\"text\":\"PickerView 选择器视图\"},{\"link\":\"/component/radio\",\"text\":\"Radio 单选框\"},{\"link\":\"/component/rate\",\"text\":\"Rate 评分\"},{\"link\":\"/component/search\",\"text\":\"Search 搜索框\"},{\"link\":\"/component/select-picker\",\"text\":\"SelectPicker 单复选选择器\"},{\"link\":\"/component/slider\",\"text\":\"Slider 滑块\"},{\"link\":\"/component/switch\",\"text\":\"Switch 开关\"},{\"link\":\"/component/upload\",\"text\":\"Upload 上传\"},{\"link\":\"/component/password-input\",\"text\":\"PasswordInput 密码输入框\"},{\"link\":\"/component/signature\",\"text\":\"Signature 签名\"}]},{\"text\":\"反馈\",\"collapsed\":false,\"items\":[{\"link\":\"/component/action-sheet\",\"text\":\"ActionSheet 动作面板\"},{\"link\":\"/component/drop-menu\",\"text\":\"DropMenu 下拉菜单\"},{\"link\":\"/component/floating-panel\",\"text\":\"FloatingPanel 浮动面板\"},{\"link\":\"/component/loading\",\"text\":\"Loading 加载\"},{\"link\":\"/component/message-box\",\"text\":\"MessageBox 弹框\"},{\"link\":\"/component/notice-bar\",\"text\":\"NoticeBar 通知栏\"},{\"link\":\"/component/overlay\",\"text\":\"Overlay 遮罩层\"},{\"link\":\"/component/progress\",\"text\":\"Progress 进度条\"},{\"link\":\"/component/circle\",\"text\":\"Circle 环形进度条\"},{\"link\":\"/component/sort-button\",\"text\":\"SortButton 排序按钮\"},{\"link\":\"/component/status-tip\",\"text\":\"StatusTip 缺省提示\"},{\"link\":\"/component/swipe-action\",\"text\":\"SwipeAction 滑动操作\"},{\"link\":\"/component/toast\",\"text\":\"Toast 轻提示\"},{\"link\":\"/component/notify\",\"text\":\"Notify 消息通知\"},{\"link\":\"/component/tooltip\",\"text\":\"Tooltip 文字提示\"},{\"link\":\"/component/count-down\",\"text\":\"CountDown 倒计时\"},{\"link\":\"/component/count-to\",\"text\":\"CountTo 数字滚动\"},{\"link\":\"/component/keyboard\",\"text\":\"Keyboard 虚拟键盘\"},{\"link\":\"/component/number-keyboard\",\"text\":\"NumberKeyboard 数字键盘\"}]},{\"text\":\"数据展示\",\"collapsed\":false,\"items\":[{\"link\":\"/component/badge\",\"text\":\"Badge 徽标\"},{\"link\":\"/component/card\",\"text\":\"Card 卡片\"},{\"link\":\"/component/cell\",\"text\":\"Cell 单元格\"},{\"link\":\"/component/collapse\",\"text\":\"Collapse 折叠面板\"},{\"link\":\"/component/curtain\",\"text\":\"Curtain 幕帘\"},{\"link\":\"/component/divider\",\"text\":\"Divider 分割线\"},{\"link\":\"/component/gap\",\"text\":\"Gap 间隔槽\"},{\"link\":\"/component/img\",\"text\":\"Img 图片\"},{\"link\":\"/component/img-cropper\",\"text\":\"ImgCropper 图片裁剪\"},{\"link\":\"/component/grid\",\"text\":\"Grid 宫格\"},{\"link\":\"/component/loadmore\",\"text\":\"Loadmore 加载更多\"},{\"link\":\"/component/skeleton\",\"text\":\"Skeleton 骨架屏\"},{\"link\":\"/component/steps\",\"text\":\"Steps 步骤条\"},{\"link\":\"/component/sticky\",\"text\":\"Sticky 粘性布局\"},{\"link\":\"/component/tag\",\"text\":\"Tag 标签\"},{\"link\":\"/component/watermark\",\"text\":\"Watermark 水印\"},{\"link\":\"/component/swiper\",\"text\":\"Swiper 轮播图\"},{\"link\":\"/component/table\",\"text\":\"Table 表格\"}]},{\"text\":\"组合式API\",\"items\":[{\"text\":\"useUpload\",\"link\":\"/component/use-upload\"},{\"text\":\"useCountDown\",\"link\":\"/component/use-count-down\"},{\"text\":\"useToast\",\"link\":\"/component/use-toast\"},{\"text\":\"useMessage\",\"link\":\"/component/use-message\"}]}]}}},\"en-US\":{\"label\":\"English\",\"lang\":\"en-US\",\"description\":\"A uni-app component library based on wot-design\",\"themeConfig\":{\"lastUpdated\":{\"text\":\"Last Updated\"},\"editLink\":{\"pattern\":\"https://github.com/Moonofweisheng/wot-design-uni/edit/master/docs/:path\",\"text\":\"Edit this page on GitHub\"},\"nav\":[{\"text\":\"Guide\",\"activeMatch\":\"/guide/\",\"items\":[{\"text\":\"Introduction\",\"link\":\"/en-US/guide/introduction\"},{\"text\":\"Quick Start\",\"link\":\"/en-US/guide/quick-use\"},{\"text\":\"CLI & Templates\",\"link\":\"/en-US/guide/cli-templates\"},{\"text\":\"Custom Theme\",\"link\":\"/en-US/guide/custom-theme\"},{\"text\":\"Common Problems\",\"link\":\"/en-US/guide/common-problems\"},{\"text\":\"Internationalization\",\"link\":\"/en-US/guide/locale\"},{\"text\":\"Changelog\",\"link\":\"/en-US/guide/changelog\"},{\"text\":\"⭐ Cases\",\"link\":\"/en-US/guide/cases\"},{\"text\":\"Join Group\",\"link\":\"/en-US/guide/join-group\"}]},{\"text\":\"Components\",\"activeMatch\":\"/component/\",\"items\":[{\"text\":\"Basic Components\",\"link\":\"/en-US/component/button\"},{\"text\":\"Navigation\",\"link\":\"/en-US/component/pagination\"},{\"text\":\"Data Input\",\"link\":\"/en-US/component/calendar\"},{\"text\":\"Feedback\",\"link\":\"/en-US/component/action-sheet\"},{\"text\":\"Data Display\",\"link\":\"/en-US/component/badge\"}]},{\"text\":\"🥤Buy Me a Coffee\",\"link\":\"/en-US/reward/reward\",\"activeMatch\":\"/reward/\"},{\"text\":\"Blog\",\"link\":\"https://blog.wot-ui.cn/\"},{\"text\":\"Templates\",\"items\":[{\"text\":\"Quick Start Template wot-starter\",\"link\":\"https://starter.wot-ui.cn/\"},{\"text\":\"vitesse-uni-app\",\"link\":\"https://vitesse-docs.netlify.app/\"},{\"text\":\"wot-starter-retail\",\"link\":\"https://github.com/wot-ui/wot-starter-retail\"},{\"text\":\"unibest\",\"link\":\"https://unibest.tech/\"}]},{\"text\":\"Resources\",\"items\":[{\"text\":\"Quick Start Template\",\"link\":\"https://starter.wot-ui.cn/\"},{\"text\":\"VS Code IntelliSense Plugin\",\"link\":\"https://marketplace.visualstudio.com/items?itemName=wot-ui.wot-ui-intellisense\"},{\"text\":\"Vue3 uni-app Router\",\"link\":\"https://moonofweisheng.github.io/uni-mini-router/\"},{\"text\":\"Mini Program CI Tool\",\"link\":\"https://github.com/Moonofweisheng/uni-mini-ci\"},{\"text\":\"Uni Helper\",\"link\":\"https://uni-helper.js.org/\"},{\"text\":\"uni-ku\",\"link\":\"https://github.com/uni-ku\"}]}],\"sidebar\":{\"/en-US/guide/\":[{\"text\":\"Introduction\",\"link\":\"/en-US/guide/introduction\"},{\"text\":\"Quick Start\",\"link\":\"/en-US/guide/quick-use\"},{\"text\":\"CLI & Templates\",\"link\":\"/en-US/guide/cli-templates\"},{\"text\":\"Custom Theme\",\"link\":\"/en-US/guide/custom-theme\"},{\"text\":\"Internationalization\",\"link\":\"/en-US/guide/locale\"},{\"text\":\"Common Problems\",\"link\":\"/en-US/guide/common-problems\"},{\"text\":\"Changelog\",\"link\":\"/en-US/guide/changelog\"},{\"text\":\"⭐ Cases\",\"link\":\"/en-US/guide/cases\"},{\"text\":\"Join Group\",\"link\":\"/en-US/guide/join-group\"}],\"/en-US/reward/\":[{\"text\":\"🥤Buy Me a Coffee\",\"link\":\"/en-US/reward/reward\"},{\"text\":\"Donor List\",\"link\":\"/en-US/reward/donor\"},{\"text\":\"Sponsor\",\"link\":\"/reward/sponsor\"}],\"/en-US/component/\":[{\"text\":\"Basic\",\"collapsed\":false,\"items\":[{\"link\":\"/en-US/component/button\",\"text\":\"Button\"},{\"link\":\"/en-US/component/icon\",\"text\":\"Icon\"},{\"link\":\"/en-US/component/layout\",\"text\":\"Layout\"},{\"link\":\"/en-US/component/config-provider\",\"text\":\"ConfigProvider\"},{\"link\":\"/en-US/component/popup\",\"text\":\"Popup\"},{\"link\":\"/en-US/component/resize\",\"text\":\"Resize\"},{\"link\":\"/en-US/component/transition\",\"text\":\"Transition\"},{\"link\":\"/en-US/component/fab\",\"text\":\"Fab\"},{\"link\":\"/en-US/component/text\",\"text\":\"Text\"},{\"link\":\"/en-US/component/root-portal\",\"text\":\"RootPortal\"}]},{\"text\":\"Navigation\",\"collapsed\":false,\"items\":[{\"link\":\"/en-US/component/pagination\",\"text\":\"Pagination\"},{\"link\":\"/en-US/component/popover\",\"text\":\"Popover\"},{\"link\":\"/en-US/component/tabs\",\"text\":\"Tabs\"},{\"link\":\"/en-US/component/segmented\",\"text\":\"Segmented\"},{\"link\":\"/en-US/component/tabbar\",\"text\":\"Tabbar\"},{\"link\":\"/en-US/component/navbar\",\"text\":\"Navbar\"},{\"link\":\"/en-US/component/sidebar\",\"text\":\"Sidebar\"},{\"link\":\"/en-US/component/backtop\",\"text\":\"Backtop\"},{\"link\":\"/en-US/component/index-bar\",\"text\":\"IndexBar\"}]},{\"text\":\"Data Input\",\"collapsed\":false,\"items\":[{\"link\":\"/en-US/component/calendar\",\"text\":\"Calendar\"},{\"link\":\"/en-US/component/calendar-view\",\"text\":\"CalendarView\"},{\"link\":\"/en-US/component/checkbox\",\"text\":\"Checkbox\"},{\"link\":\"/en-US/component/col-picker\",\"text\":\"ColPicker\"},{\"link\":\"/en-US/component/datetime-picker\",\"text\":\"DatetimePicker\"},{\"link\":\"/en-US/component/datetime-picker-view\",\"text\":\"DatetimePickerView\"},{\"link\":\"/en-US/component/form\",\"text\":\"Form\"},{\"link\":\"/en-US/component/input\",\"text\":\"Input\"},{\"link\":\"/en-US/component/textarea\",\"text\":\"Textarea\"},{\"link\":\"/en-US/component/input-number\",\"text\":\"InputNumber\"},{\"link\":\"/en-US/component/picker\",\"text\":\"Picker\"},{\"link\":\"/en-US/component/picker-view\",\"text\":\"PickerView\"},{\"link\":\"/en-US/component/radio\",\"text\":\"Radio\"},{\"link\":\"/en-US/component/rate\",\"text\":\"Rate\"},{\"link\":\"/en-US/component/search\",\"text\":\"Search\"},{\"link\":\"/en-US/component/select-picker\",\"text\":\"SelectPicker\"},{\"link\":\"/en-US/component/slider\",\"text\":\"Slider\"},{\"link\":\"/en-US/component/switch\",\"text\":\"Switch\"},{\"link\":\"/en-US/component/upload\",\"text\":\"Upload\"},{\"link\":\"/en-US/component/password-input\",\"text\":\"PasswordInput\"},{\"link\":\"/en-US/component/signature\",\"text\":\"Signature\"}]},{\"text\":\"Feedback\",\"collapsed\":false,\"items\":[{\"link\":\"/en-US/component/action-sheet\",\"text\":\"ActionSheet\"},{\"link\":\"/en-US/component/drop-menu\",\"text\":\"DropMenu\"},{\"link\":\"/en-US/component/floating-panel\",\"text\":\"FloatingPanel\"},{\"link\":\"/en-US/component/loading\",\"text\":\"Loading\"},{\"link\":\"/en-US/component/message-box\",\"text\":\"MessageBox\"},{\"link\":\"/en-US/component/notice-bar\",\"text\":\"NoticeBar\"},{\"link\":\"/en-US/component/overlay\",\"text\":\"Overlay\"},{\"link\":\"/en-US/component/progress\",\"text\":\"Progress\"},{\"link\":\"/en-US/component/circle\",\"text\":\"Circle\"},{\"link\":\"/en-US/component/sort-button\",\"text\":\"SortButton\"},{\"link\":\"/en-US/component/status-tip\",\"text\":\"StatusTip\"},{\"link\":\"/en-US/component/swipe-action\",\"text\":\"SwipeAction\"},{\"link\":\"/en-US/component/toast\",\"text\":\"Toast\"},{\"link\":\"/en-US/component/notify\",\"text\":\"Notify\"},{\"link\":\"/en-US/component/tooltip\",\"text\":\"Tooltip\"},{\"link\":\"/en-US/component/count-down\",\"text\":\"CountDown\"},{\"link\":\"/en-US/component/count-to\",\"text\":\"CountTo\"},{\"link\":\"/en-US/component/keyboard\",\"text\":\"Keyboard\"},{\"link\":\"/en-US/component/number-keyboard\",\"text\":\"NumberKeyboard\"}]},{\"text\":\"Data Display\",\"collapsed\":false,\"items\":[{\"link\":\"/en-US/component/badge\",\"text\":\"Badge\"},{\"link\":\"/en-US/component/card\",\"text\":\"Card\"},{\"link\":\"/en-US/component/cell\",\"text\":\"Cell\"},{\"link\":\"/en-US/component/collapse\",\"text\":\"Collapse\"},{\"link\":\"/en-US/component/curtain\",\"text\":\"Curtain\"},{\"link\":\"/en-US/component/divider\",\"text\":\"Divider\"},{\"link\":\"/en-US/component/gap\",\"text\":\"Gap\"},{\"link\":\"/en-US/component/img\",\"text\":\"Img\"},{\"link\":\"/en-US/component/img-cropper\",\"text\":\"ImgCropper\"},{\"link\":\"/en-US/component/grid\",\"text\":\"Grid\"},{\"link\":\"/en-US/component/loadmore\",\"text\":\"Loadmore\"},{\"link\":\"/en-US/component/skeleton\",\"text\":\"Skeleton\"},{\"link\":\"/en-US/component/steps\",\"text\":\"Steps\"},{\"link\":\"/en-US/component/sticky\",\"text\":\"Sticky\"},{\"link\":\"/en-US/component/tag\",\"text\":\"Tag\"},{\"link\":\"/en-US/component/watermark\",\"text\":\"Watermark\"},{\"link\":\"/en-US/component/swiper\",\"text\":\"Swiper\"},{\"link\":\"/en-US/component/table\",\"text\":\"Table\"}]},{\"text\":\"Composables\",\"items\":[{\"text\":\"useUpload\",\"link\":\"/en-US/component/use-upload\"},{\"text\":\"useCountDown\",\"link\":\"/en-US/component/use-count-down\"},{\"text\":\"useToast\",\"link\":\"/en-US/component/use-toast\"},{\"text\":\"useMessage\",\"link\":\"/en-US/component/use-message\"}]}]}}}},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
</body>
</html>