微信小程序顶部导航栏-微信小程序地图导航

微信小程序点击顶部导航栏切换样式代码示例

更新时间：2019-11-12 14:54:46 作者：Liha T

本文主要介绍微信小程序点击顶部导航栏切换样式代码的示例代码。 示例代码介绍的很详细。 对大家的学习或者工作都有一定的参考学习价值。 需要的朋友可以参考以下

本文主要介绍微信小程序点击顶部导航栏切换样式代码的示例代码。 示例代码介绍的很详细。 对大家的学习或者工作都有一定的参考学习价值。 需要的朋友可以参考以下

类似这个效果

  

  
   
    {{item.itemsName}} 
   
  
 

.helpDisList .content{

 position: relative;
 width: 710rpx;
 border-radius: 5rpx;
}
.active{ //当点击的时候添加这个样式
 /* border-bottom: 4rpx solid rgb(252, 186, 7); */
 color:rgb(252, 186, 7);

}

Page({
 data:{
  helpCateList:[ //数据从后台请求回来赋值
   // { id: "1", desc: "康复医疗" },
   // { id: "2", desc: "教育" },

   // { id: "3", desc: "就业" },
   // { id: "4", desc: "扶贫" },
   // { id: "5", desc: "职业培训" },
   // { id: "6", desc: "社会保障" },
   // { id: "7", desc: "文化生活" },
  ],
  currentTab: 1,
 },

 cateChange(e) {
  console.log(e)
  let that = this
  that.setData({
   currentTab: e.currentTarget.dataset.itemsid, //这个必须要
  })
 },

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