微信小程序竖版tab,点击切换页面

最新推荐文章于 2024-05-08 16:54:11 发布

一只想瘦的程序小白

最新推荐文章于 2024-05-08 16:54:11 发布

阅读量1.4k

点赞数 1

分类专栏：微信小程序前端文章标签：微信小程序竖版tab 切换页面

本文链接：https://blog.csdn.net/qq_43467000/article/details/98097194

版权

本文介绍如何在微信小程序中创建竖版Tab并实现在点击时切换页面。在WXML、JS和CSS代码示例的基础上，讨论了解决初次加载页面显示空白的问题，并通过在JS文件的data中添加特定代码，将‘最热’设为默认显示页面。

摘要由CSDN通过智能技术生成

竖版的tab,点击切换页面，代码如下:

wxml:

<view class="swiper-tab">
  <view class="swiper-tab-item {
  {currentTab==0?'active':''}}" data-current="0" bindtap="clickTab"><text>最热</text></view>
  <view class="swiper-tab-item {
  {currentTab==1?'active':''}}" data-current="1" bindtap="clickTab"><text>最新</text></view>
</view>
<view class = "{
  {currentTab == 0 ? 'show':'hidden'}}" >
    <scroll-view>
    </scroll-view>
</view>
  <view class = "{
  {currentTab == 1 ? 'show':'hidden'}}" >
    <scroll-view>