add uniapp component...

This commit is contained in:
2024-08-05 14:23:47 +08:00
parent 25a2270e2e
commit af3944558c
19 changed files with 696 additions and 33 deletions

View File

@@ -1,10 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<search>
<entry>
<title>About me</title>
<url>/20240730/about/me/</url>
<content><![CDATA[<h2 id="about"><a href="#about" class="headerlink" title="about"></a>about</h2>]]></content>
</entry>
<entry>
<title>Hello World</title>
<url>/20240730/hello-world/</url>
@@ -21,6 +16,20 @@
<h3 id="Deploy-to-remote-sites"><a href="#Deploy-to-remote-sites" class="headerlink" title="Deploy to remote sites"></a>Deploy to remote sites</h3><figure class="highlight bash"><table><tr><td class="code"><pre><span class="line">$ hexo deploy</span><br></pre></td></tr></table></figure>
<p>More info: <a href="https://hexo.io/docs/one-command-deployment.html">Deployment</a></p>
]]></content>
</entry>
<entry>
<title>About me</title>
<url>/20240730/about/me/</url>
<content><![CDATA[<h2 id="about"><a href="#about" class="headerlink" title="about"></a>about</h2>]]></content>
</entry>
<entry>
<title>page</title>
<url>/20240801/frontend/frontend/</url>
<content><![CDATA[<ul>
<li><a href="./deploy">deploy</a></li>
<li></li>
</ul>
]]></content>
</entry>
<entry>
@@ -68,12 +77,33 @@
]]></content>
</entry>
<entry>
<title>page</title>
<url>/20240801/frontend/frontend/</url>
<title>uniapp 开发</title>
<url>/20240805/frontend/uniapp/uniapp/</url>
<content><![CDATA[<ul>
<li><a href="./deploy">deploy</a></li>
<li></li>
<li><a href="../component1">uniapp component</a></li>
</ul>
]]></content>
<tags>
<tag>uniapp</tag>
</tags>
</entry>
<entry>
<title>组件使用</title>
<url>/20240805/frontend/uniapp/component1/</url>
<content><![CDATA[<h3 id="组件自动导入"><a href="#组件自动导入" class="headerlink" title="组件自动导入"></a>组件自动导入</h3><figure class="highlight json"><table><tr><td class="code"><pre><span class="line"><span class="attr">&quot;easycom&quot;</span><span class="punctuation">:</span><span class="punctuation">&#123;</span></span><br><span class="line"> <span class="attr">&quot;autoscan&quot;</span><span class="punctuation">:</span> <span class="literal"><span class="keyword">true</span></span><span class="punctuation">,</span></span><br><span class="line"> <span class="attr">&quot;custom&quot;</span><span class="punctuation">:</span> <span class="punctuation">&#123;</span></span><br><span class="line"> <span class="attr">&quot;^tui-(.*)&quot;</span><span class="punctuation">:</span> <span class="string">&quot;@/components/thorui/tui-$1/tui-$1.vue&quot;</span> <span class="comment">// 匹配components目录内的vue文件</span></span><br><span class="line"> <span class="punctuation">&#125;</span></span><br><span class="line"><span class="punctuation">&#125;</span></span><br></pre></td></tr></table></figure>
<h3 id="tui-sticky-吸顶容器"><a href="#tui-sticky-吸顶容器" class="headerlink" title="tui-sticky 吸顶容器"></a><code>tui-sticky 吸顶容器</code></h3><blockquote>
<p>包含 以下 <code>tui</code> 组件 :</p>
<ul>
<li>tui-sticky</li>
<li>tui-list-view</li>
<li>tui-list-cell</li>
</ul>
</blockquote>
<figure class="highlight html"><table><tr><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">tui-sticky</span> <span class="attr">:scrollTop</span>=<span class="string">&quot;scrollTop&quot;</span> <span class="attr">stickyHeight</span>=<span class="string">&quot;104rpx&quot;</span> <span class="attr">container</span>&gt;</span></span><br><span class="line"> <span class="comment">&lt;!-- header start --&gt;</span></span><br><span class="line"> <span class="tag">&lt;<span class="name">template</span> <span class="attr">v-slot:header</span>&gt;</span></span><br><span class="line"> <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;sticky-item&quot;</span>&gt;</span></span><br><span class="line"> <span class="tag">&lt;<span class="name">view</span> <span class="attr">class</span>=<span class="string">&quot;setting&quot;</span>&gt;</span>设置<span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line"> <span class="tag">&lt;/<span class="name">view</span>&gt;</span></span><br><span class="line"> <span class="tag">&lt;/<span class="name">template</span>&gt;</span></span><br><span class="line"> <span class="comment">&lt;!-- header end --&gt;</span></span><br><span class="line"> <span class="comment">&lt;!--内容 start--&gt;</span></span><br><span class="line"> <span class="tag">&lt;<span class="name">template</span> <span class="attr">v-slot:content</span>&gt;</span></span><br><span class="line"> <span class="tag">&lt;<span class="name">tui-list-view</span> <span class="attr">class</span>=<span class="string">&quot;content&quot;</span>&gt;</span></span><br><span class="line"> <span class="tag">&lt;<span class="name">tui-list-cell</span> <span class="attr">:arrow</span>=<span class="string">&quot;false&quot;</span>&gt;</span></span><br><span class="line"> <span class="tag">&lt;<span class="name">switch</span> <span class="attr">class</span>=<span class="string">&#x27;switch&#x27;</span> <span class="attr">checked</span> <span class="attr">color</span>=<span class="string">&quot;#FFCC33&quot;</span> /&gt;</span></span><br><span class="line"> <span class="tag">&lt;/<span class="name">tui-list-cell</span>&gt;</span></span><br><span class="line"> <span class="tag">&lt;/<span class="name">tui-list-view</span>&gt;</span></span><br><span class="line"> <span class="tag">&lt;/<span class="name">template</span>&gt;</span></span><br><span class="line"> <span class="comment">&lt;!--内容 end--&gt;</span></span><br><span class="line"><span class="tag">&lt;/<span class="name">tui-sticky</span>&gt;</span></span><br><span class="line"></span><br><span class="line"><span class="tag">&lt;<span class="name">script</span> <span class="attr">setup</span>&gt;</span><span class="language-javascript"></span></span><br><span class="line"><span class="language-javascript"> <span class="keyword">import</span> &#123; ref &#125; <span class="keyword">from</span> <span class="string">&#x27;vue&#x27;</span></span></span><br><span class="line"><span class="language-javascript"> <span class="keyword">import</span> &#123; onPageScroll &#125; <span class="keyword">from</span> <span class="string">&#x27;@dcloudio/uni-app&#x27;</span></span></span><br><span class="line"><span class="language-javascript"></span></span><br><span class="line"><span class="language-javascript"> <span class="comment">// 定义 scrollTop 响应式变量</span></span></span><br><span class="line"><span class="language-javascript"> <span class="keyword">const</span> scrollTop = <span class="title function_">ref</span>(<span class="number">0</span>)</span></span><br><span class="line"><span class="language-javascript"> <span class="comment">// 监听页面滚动事件</span></span></span><br><span class="line"><span class="language-javascript"> <span class="title function_">onPageScroll</span>(<span class="function">(<span class="params">e</span>) =&gt;</span> &#123;</span></span><br><span class="line"><span class="language-javascript"> scrollTop.<span class="property">value</span> = e.<span class="property">scrollTop</span></span></span><br><span class="line"><span class="language-javascript"> &#125;)</span></span><br><span class="line"><span class="language-javascript"></span><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span><br></pre></td></tr></table></figure>
]]></content>
<tags>
<tag>uniapp</tag>
</tags>
</entry>
</search>