微信小程序之顶部导航栏（选项卡）实例 —— 微信小程序实战系列（1）

最新推荐文章于 2024-08-06 15:09:03 发布

Python_林一

最新推荐文章于 2024-08-06 15:09:03 发布

阅读量541

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/AndroidAlvin/article/details/105677429

需求：顶部导航栏

效果图：

wxml：

<!--导航条-->
<view class="navbar">
  <text wx:for="{
  {navbar}}" data-idx="{
  {index}}" class="item {
  {currentTab==index ? 'active' : ''}}" wx:key="unique" bindtap="navbarTap">{
  {item}}</text>
</view>
 
<!--首页-->
<view hidden="{
  {currentTab!==0}}">
  tab_01
</view>
 
<!--搜索-->
<view hidden="{
  {currentTab!==1}}">