微信小程序 navbar

//data

typeList: [
        { name: "日报", id: "1" },
        { name: "周报", id: "2" },
        { name: "月报", id: "3" },
        { name: "目录", id: "4" }]

//js

 that.setData({
       dateValue: util.formatTime(new Date()),  //picker date
       typeList: appInstance.typeList,
       currentTypeId: "1"
 })


//添加点击模板点击事件
for (var i = 0; i < appInstance.typeList.length; i++) {
    (function (item) {
        pageObject['bind' + item.id] = function (e) {
            this.setData({
                currentTypeId: e.currentTarget.dataset.index
            })
        }
    })(appInstance.typeList[i])
}

//wxml

  

    
      
{{type.name}}
    
  
  时间：{{dateValue}}
    
  

//wxss

.timePicker {
  width: 90%;
  padding: 10rpx;
  margin: auto;
  border: 1px solid red;
}

.menu {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
}

dt {
  width: 25%;
  height: 100rpx;
}

.noCurrentType {
  height: 90rpx;
  color: black;
  padding-left: 30rpx;
  border: 1px solid;
  background-color: #c2c2c2;
}

.yesCurrentType {
  color: black;
  padding-left: 30rpx;
}