vant/static/js/async/1829.a1a4e5b3.js

/*! For license information please see 1829.a1a4e5b3.js.LICENSE.txt */
(self.webpackChunk=self.webpackChunk||[]).push([["1829"],{22169:function(s,a,n){"use strict";n.r(a);var l=n("80681");let t=["innerHTML"];a.default={setup:()=>({html:""}),render:()=>((0,l.wg)(),(0,l.iD)("div",{class:"van-doc-markdown-body",innerHTML:'<h1>\u5185\u7F6E\u6837\u5F0F</h1>\n<div class="van-doc-card"><h3 id="jie-shao" tabindex="-1">\u4ECB\u7ECD</h3>\n<p>Vant \u4E2D\u9ED8\u8BA4\u5305\u542B\u4E86\u4E00\u4E9B\u5E38\u7528\u6837\u5F0F\uFF0C\u53EF\u4EE5\u76F4\u63A5\u901A\u8FC7 className \u7684\u65B9\u5F0F\u4F7F\u7528\u3002</p>\n</div><div class="van-doc-card"><h3 id="wen-zi-sheng-lue" tabindex="-1">\u6587\u5B57\u7701\u7565</h3>\n<p>\u5F53\u6587\u672C\u5185\u5BB9\u957F\u5EA6\u8D85\u8FC7\u5BB9\u5668\u6700\u5927\u5BBD\u5EA6\u65F6\uFF0C\u81EA\u52A8\u7701\u7565\u591A\u4F59\u7684\u6587\u672C\u3002</p>\n<pre><code class="language-html"><span class="hljs-comment">&lt;!-- \u6700\u591A\u663E\u793A\u4E00\u884C --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-ellipsis&quot;</span>&gt;</span>\u8FD9\u662F\u4E00\u6BB5\u6700\u591A\u663E\u793A\u4E00\u884C\u7684\u6587\u5B57\uFF0C\u591A\u4F59\u7684\u5185\u5BB9\u4F1A\u88AB\u7701\u7565<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u6700\u591A\u663E\u793A\u4E24\u884C --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-multi-ellipsis--l2&quot;</span>&gt;</span>\n  \u8FD9\u662F\u4E00\u6BB5\u6700\u591A\u663E\u793A\u4E24\u884C\u7684\u6587\u5B57\uFF0C\u591A\u4F59\u7684\u5185\u5BB9\u4F1A\u88AB\u7701\u7565\n<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u6700\u591A\u663E\u793A\u4E09\u884C --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-multi-ellipsis--l3&quot;</span>&gt;</span>\n  \u8FD9\u662F\u4E00\u6BB5\u6700\u591A\u663E\u793A\u4E09\u884C\u7684\u6587\u5B57\uFF0C\u591A\u4F59\u7684\u5185\u5BB9\u4F1A\u88AB\u7701\u7565\n<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n</code></pre>\n</div><div class="van-doc-card"><h3 id="1px-bian-kuang" tabindex="-1">1px \u8FB9\u6846</h3>\n<p>\u4E3A\u5143\u7D20\u6DFB\u52A0 Retina \u5C4F\u5E55\u4E0B\u7684 1px \u8FB9\u6846\uFF08\u5373 hairline\uFF09\uFF0C\u57FA\u4E8E\u4F2A\u7C7B transform \u5B9E\u73B0\u3002</p>\n<pre><code class="language-html"><span class="hljs-comment">&lt;!-- \u4E0A\u8FB9\u6846 --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-hairline--top&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u4E0B\u8FB9\u6846 --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-hairline--bottom&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u5DE6\u8FB9\u6846 --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-hairline--left&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u53F3\u8FB9\u6846 --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-hairline--right&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u4E0A\u4E0B\u8FB9\u6846 --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-hairline--top-bottom&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u5168\u8FB9\u6846 --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-hairline--surround&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n</code></pre>\n</div><div class="van-doc-card"><h3 id="an-quan-qu" tabindex="-1">\u5B89\u5168\u533A</h3>\n<p>\u4E3A\u5143\u7D20\u6DFB\u52A0\u5B89\u5168\u533A\u9002\u914D\u3002</p>\n<pre><code class="language-html"><span class="hljs-comment">&lt;!-- \u9876\u90E8\u5B89\u5168\u533A --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-safe-area-top&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u5E95\u90E8\u5B89\u5168\u533A --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-safe-area-bottom&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n</code></pre>\n</div><div class="van-doc-card"><h3 id="dong-hua" tabindex="-1">\u52A8\u753B</h3>\n<p>\u53EF\u4EE5\u901A\u8FC7 <code>transition</code> \u7EC4\u4EF6\u4F7F\u7528\u5185\u7F6E\u7684\u52A8\u753B\u7C7B\u3002</p>\n<pre><code class="language-html"><span class="hljs-comment">&lt;!-- \u6DE1\u5165 --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">transition</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;van-fade&quot;</span>&gt;</span>\n  <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">v-show</span>=<span class="hljs-string">&quot;visible&quot;</span>&gt;</span>Fade<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n<span class="hljs-tag">&lt;/<span class="hljs-name">transition</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u4E0A\u6ED1\u8FDB\u5165 --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">transition</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;van-slide-up&quot;</span>&gt;</span>\n  <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">v-show</span>=<span class="hljs-string">&quot;visible&quot;</span>&gt;</span>Slide Up<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n<span class="hljs-tag">&lt;/<span class="hljs-name">transition</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u4E0B\u6ED1\u8FDB\u5165 --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">transition</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;van-slide-down&quot;</span>&gt;</span>\n  <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">v-show</span>=<span class="hljs-string">&quot;visible&quot;</span>&gt;</span>Slide Down<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n<span class="hljs-tag">&lt;/<span class="hljs-name">transition</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u5DE6\u6ED1\u8FDB\u5165 --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">transition</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;van-slide-left&quot;</span>&gt;</span>\n  <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">v-show</span>=<span class="hljs-string">&quot;visible&quot;</span>&gt;</span>Slide Left<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n<span class="hljs-tag">&lt;/<span class="hljs-name">transition</span>&gt;</span>\n\n<span class="hljs-comment">&lt;!-- \u53F3\u6ED1\u8FDB\u5165 --&gt;</span>\n<span class="hljs-tag">&lt;<span class="hljs-name">transition</span> <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;van-slide-right&quot;</span>&gt;</span>\n  <span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">v-show</span>=<span class="hljs-string">&quot;visible&quot;</span>&gt;</span>Slide Right<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n<span class="hljs-tag">&lt;/<span class="hljs-name">transition</span>&gt;</span>\n</code></pre>\n</div><div class="van-doc-card"><h3 id="chu-peng-fan-kui" tabindex="-1">\u89E6\u78B0\u53CD\u9988</h3>\n<p>\u4E3A\u5143\u7D20\u6DFB\u52A0\u89E6\u78B0\u53CD\u9988\u6548\u679C\uFF0C\u89E6\u78B0\u540E\uFF0C\u5143\u7D20\u7684\u900F\u660E\u5EA6\u4F1A\u964D\u4F4E\u3002</p>\n<p>\u901A\u5E38\u7528\u4E8E\u6309\u94AE\u7B49\u53EF\u70B9\u51FB\u7684\u5143\u7D20\u4E0A\u3002</p>\n<pre><code class="language-html"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-haptics-feedback&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n</code></pre>\n</div><div class="van-doc-card"><h3 id="qing-chu-fu-dong" tabindex="-1">\u6E05\u9664\u6D6E\u52A8</h3>\n<p>\u6E05\u9664\u5143\u7D20\u5728 float \u5E03\u5C40\u4E0B\u7684\u6D6E\u52A8\uFF0C</p>\n<pre><code class="language-html"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">&quot;van-clearfix&quot;</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>\n</code></pre>\n</div>'},null,8,t))}}}]);