小程序实现tab切换

最新推荐文章于 2024-04-13 11:35:17 发布

可别null了

最新推荐文章于 2024-04-13 11:35:17 发布

阅读量77

点赞数

分类专栏：小程序文章标签：小程序

本文链接：https://blog.csdn.net/R_RA222/article/details/118673489

版权

本文介绍如何在微信小程序中实现Tab切换功能，通过CSS样式控制不同内容的显示与隐藏，达到平滑的页面交互体验。

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

小程序实现tab切换

<view class="comment_user">
				<view class="swiper-tab">
						<view class="swiper-tab-list {
  {currentTab==0 ? 'on' : ''}}" data-current="0" bindtap="swichNav">全部</view>
						<view class="swiper-tab-list {
  {currentTab==1 ? 'on' : ''}}" data-current="1" bindtap="swichNav">最新</view>
				</view>

				<swiper current="{
  {currentTab}}" class="swiper-box" duration="300" style="height:{
  {winHeight - 31}}px" bindchange="bindChange">
						<swiper-item>
								<view>全部</view>
						</swiper-item>
						<swiper-item>
								<view>最新</view>
						</swiper-item>
				</swiper>
		</view>

css