动态tabbar

src/App.vue

@@ -1,8 +1,79 @@
-<script setup lang="ts">
-import { onLaunch, onShow, onHide } from "@dcloudio/uni-app"
-onLaunch(() => {})
-onShow(() => {})
-onHide(() => {})
+<script lang="ts">
+// import { onLaunch, onShow, onHide } from "@dcloudio/uni-app"
+// onLaunch(() => {})
+// onShow(() => {})
+// onHide(() => {})
+
+const tabbar = [
+	{
+		pagePath: "pages/tabbar/home",
+		text: "首页",
+		iconPath: "/static/tabbar/home.png",
+		selectedIconPath: "/static/tabbar/home-select.png",
+	},
+	// {
+	// 	"pagePath": "pages/tabbar/shop",
+	// 	"text": "超市",
+	// 	"iconPath": "/static/tabbar/shop.png",
+	// 	"selectedIconPath": "/static/tabbar/shop-select.png"
+	// },
+	{
+		pagePath: "pages/tabbar/order",
+		text: "订单",
+		iconPath: "/static/tabbar/order.png",
+		selectedIconPath: "/static/tabbar/order-select.png",
+	},
+	{
+		pagePath: "pages/tabbar/flowStatistics",
+		text: "流水统计",
+		iconPath: "/static/tabbar/order.png",
+		selectedIconPath: "/static/tabbar/order-select.png",
+	},
+	{
+		pagePath: "pages/tabbar/individualOrder",
+		text: "订单",
+		iconPath: "/static/tabbar/order.png",
+		selectedIconPath: "/static/tabbar/order-select.png",
+	},
+	{
+		pagePath: "pages/tabbar/my",
+		text: "我的",
+		iconPath: "/static/tabbar/my.png",
+		selectedIconPath: "/static/tabbar/my-select.png",
+	},
+]
+
+export default {
+	onLaunch() {},
+	onShow() {},
+	onHide() {},
+
+	methods: {
+		_initTabbar() {
+			tabbar.forEach(({ pagePath, text, iconPath, selectedIconPath }, index) => {
+				if (index === 2) {
+					uni.setTabBarItem({
+						index: index,
+						pagePath,
+						text,
+						iconPath,
+						selectedIconPath,
+						visible: true,
+					})
+				} else {
+					uni.setTabBarItem({
+						index: index,
+						pagePath,
+						text,
+						iconPath,
+						selectedIconPath,
+						visible: true,
+					})
+				}
+			})
+		},
+	},
+}
 </script>
 
 <style lang="scss">