iot-test-app/components/tabbar/tabbar.vue

<template>
	<view class="u-page">
		<view class="u-page__item">
			<u-gap height="150"></u-gap>
			<u-tabbar :value="value" @change='name => value = name' :fixed="true" :placeholder="true"
				:safeAreaInsetBottom="true">
				<u-tabbar-item @click='changeRouter(value,item)' v-for="item in tabbarList " :key="item.icon"
					:text="item.text" :icon="item.icon">
				</u-tabbar-item>
			</u-tabbar>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			value:{
				type:Number,
				default:0
			},
			
		},
		data() {
			return {
				// value: 0,
				tabbarList: [{
						text: "房间",
						icon: "home",
						path:'/pages/tabbar/room/room'
					},
					{
						text: "网关",
						icon: "order",
						path:'/pages/tabbar/gateway/gateway'
					},
					{
						text: "首页",
						icon: "grid",
						path:'/pages/tabbar/index/index'
					},
					{
						text: "蓝牙",
						icon: "play-right",
						path:'/pages/tabbar/Bluetooth/Bluetooth'
					},
					{
						text: "我的",
						icon: "account",
						path:'/pages/tabbar/mine/mine'
					}
				]
			}
		},

		methods: {
			changeRouter(value,item) {
				console.log(value,item);
				this.value=value
				uni.redirectTo({
					url:item.path
				})
				// if(value==1){
				// 	uni.redirectTo({
				// 		url:"/pages/tabbar/gateway/gateway?id="+1
				// 	})
				// }
			}
		},
	}
</script>

<style lang="scss">
	.u-page {
		padding: 0;

		&__item {

			&__title {
				color: $u-tips-color;
				background-color: $u-bg-color;
				padding: 15px;
				font-size: 15px;

				&__slot-title {
					color: $u-primary;
					font-size: 14px;
				}
			}

			&__slot-icon {
				width: 17px;
				height: 17px;
			}
		}
	}
</style>