11111111

custom-tab-bar/index.js

@@ -0,0 +1,50 @@
+Component({
+  data: {
+    selected: 0,
+	"color": "#FFEEE1",
+	"selectedColor": "#FFFFFF",
+	"backgroundColor": "#F69448",
+    list: [
+	{
+		"pagePath": "/pages/home/cloudCard",
+		"text": "补充菜窖",
+		"iconPath": "/static/bomicon/bom_notCloudCard.png",
+		"selectedIconPath": "/static/bomicon/bom_cloudCard.png"
+	},
+	{
+		"pagePath": "/pages/home/pickUpCard",
+		"text": "选菜窖",
+		"iconPath": "/static/bomicon/bom_notPickUp.png",
+		"selectedIconPath": "/static/bomicon/bom_pickUp.png"
+	},
+	{
+		"pagePath": "/pages/home/recordList2",
+		"text": "预约记录",
+		"iconPath": "/static/bomicon/bom_notRecordNew.png",
+		"selectedIconPath": "/static/bomicon/bom_recordNew.png"
+	}
+	,
+	
+	// {
+	// 	"pagePath": "/pages/home/myHome",
+	// 	"text": "我的",
+	// 	"iconPath": "/static/bomicon/bom_NotMy.png",
+	// 	"selectedIconPath": "/static/bomicon/bom_my.png"
+	// }
+	
+	]
+  },
+  attached() {
+  },
+  methods: {
+    switchTab(e) {
+      const data = e.currentTarget.dataset
+      const url = data.path
+	  // console.log("ssss0",data);
+      wx.switchTab({url})
+      // this.setData({
+      //   selected: data.index
+      // })
+    }
+  }
+})

custom-tab-bar/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

custom-tab-bar/index.wxml

@@ -0,0 +1,7 @@
+<cover-view class="tab-bar">
+  <cover-view class="tab-bar-border"></cover-view>
+  <cover-view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab">
+    <cover-image src="{{selected === index ? item.selectedIconPath : item.iconPath}}"></cover-image>
+    <cover-view style="color: {{selected === index ? selectedColor : color}}">{{item.text}}</cover-view>
+  </cover-view>
+</cover-view>

custom-tab-bar/index.wxss

@@ -0,0 +1,46 @@
+.tab-bar {
+	 pointer-events: auto;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 50px;
+  /* background: #F69448; */
+  display: flex;
+  padding-top: 5px;
+  padding-bottom: 5px;
+ /* 加载背景图 */
+ background-image: url(https://supervise.yxtsoft.com/lpk/image/bom_navigation.png);
+ /* 让背景图基于容器大小伸缩 */
+ background-size: 100% 100%;
+  /* padding-bottom: env(safe-area-inset-bottom); */
+}
+ 
+.tab-bar-border {
+  background-color: rgba(246, 148, 72, 0.3);
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 1px;
+  transform: scaleY(0.5);
+}
+ 
+.tab-bar-item {
+  flex: 1;
+  text-align: center;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+}
+ 
+.tab-bar-item cover-image {
+  width: 27px;
+  height: 27px;
+}
+ 
+.tab-bar-item cover-view {
+	margin-top: 3px;
+  font-size: 10px;
+}