微信小程序实战之顶部导航栏(选项卡)(1)

前端之家收集整理的这篇文章主要介绍了微信小程序实战之顶部导航栏(选项卡)(1)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

本文实例为大家分享微信小程序顶部导航栏的具体代码,供大家参考,具体内容如下

需求:

顶部导航栏

效果图:

wxml:

<view hidden="{{currentTab!==0}}">
tab_01

<view hidden="{{currentTab!==1}}">
tab_02

<view hidden="{{currentTab!==2}}">
tab_03

wxss:

js:

首页','搜索','我'],currentTab: 0 },navbarTap: function(e){ this.setData({ currentTab: e.currentTarget.dataset.idx }) } })

运行:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

猜你在找的微信小程序相关文章