初始化

custom-tab-bar/index.js

@@ -0,0 +1,38 @@
+// custom-tab-bar/index.js
+Component({
+	lifetimes: {
+		attached: function () {
+			this.getTabBar(tabBar => {
+				let value = tabBar.data.selected
+				this.setData({
+					selected: value
+				})
+			})
+		},
+
+	},
+	data: {
+		selected: '',
+		tabList: [
+			{
+				path: "/pages/home/index",
+				label: '首页',
+				icon: 'home'
+			},
+			{
+				path: "/pages/expert/index",
+				label: '专家服务',
+				icon: 'call-1'
+			}
+		]
+	},
+	methods: {
+		switchTab(e) {
+			let value = e.detail.value
+			let info = this.data.tabList.find(item => item.label == value)
+			if (info) {
+				wx.switchTab({ url: info.path })
+			}
+		}
+	}
+})

custom-tab-bar/index.json

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

custom-tab-bar/index.scss

@@ -0,0 +1,5 @@
+.t-tab-bar {
+	box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.15);
+	--td-tab-bar-active-color: rgba(0, 106, 106, 1);
+	--td-tab-bar-color: rgba(151, 151, 151, 1);
+}

custom-tab-bar/index.wxml

@@ -0,0 +1,12 @@
+<t-tab-bar t-class="t-tab-bar"
+		   defaultValue="label1"
+		   value="{{selected}}"
+		   bindchange="switchTab"
+		   split="{{false}}">
+	<t-tab-bar-item value="{{item.label}}"
+					icon="{{item.icon}}"
+					wx:for="{{tabList}}"
+					wx:key="index">
+		{{item.label}}
+	</t-tab-bar-item>
+</t-tab-bar>