 
<template>
		<view class="tabbar"  :style="{'padding-bottom':BottomSafeHeight+'px'}">
			<view class="navigator" >
				<view class="navigator-item" v-for="(item,index) in tabBar.list" :key="item.pagePath"
					@click="switchTab(index)">
						<img :src="item.iconPath" class="icon" v-if="selectedIndex !== index">
						<img :src="item.selectedIconPath" class="icon" v-else>
						<text :class="['item-text',{'text-active':selectedIndex === index}]">{{item.text}}</text>
				</view>
			</view>
		</view>
	</view>

</template>
<script>
	export default {
    props:['select'],
	watch:{
		select(val){
     		 this.selectedIndex = Number(val)
		}
	},
    mounted(){
		this.BottomSafeHeight = uni.getStorageSync('BottomSafeHeight')||10
		uni.setStorageSync("taBarHeight",(this.BottomSafeHeight+376))
		uni.setStorageSync("shopCar",this.BottomSafeHeight==10?120:(this.BottomSafeHeight+288)/2)
		uni.setStorageSync("orderBottom",(this.BottomSafeHeight+150))
    	this.selectedIndex = Number(this.select)
    //   console.log(this.select)
    //   this.selectedIndex = Number(this.select)
      // this.selectedIndex = 0
      // const url = uni.getStorageSync('url')
			// const nowUrl = this.tabBar.list.findIndex(item => url === item.pagePath)
      // this.selectedIndex = nowUrl
      // console.log(nowUrl)
    },
		data() {
			return {
				selectedIndex: 0,
				showselected: false,
				BottomSafeHeight:0,
				tabBar: {
					list: [
            {
               "iconPath": "/static/imgs/caidanweixuanzhong.png",
               "selectedIconPath": "/static/imgs/caidanxuanzhong.png",
               "pagePath": "pages/menu/menu",
               "text": "菜单"
             },
             {
               "iconPath": "/static/imgs/dingdanweixuanzhong.png",
               "selectedIconPath": "/static/imgs/dingdanxuanzhong.png",
               "pagePath": "pages/order/order",
               "text": "订单"
             },
             {
               "iconPath": "/static/imgs/wodeweixuanzhong.png",
               "selectedIconPath": "/static/imgs/wodexuanzhong.png",
               "pagePath": "pages/mine/mine", 
               "text": "我的"
             }
					]
				},
			}
		},
		// beforeCreate() {
		// 	this.__path__ = this.$route.path
		// },
		methods: {
			switchTab(index, item) {
				this.$emit('changeIndex',index)
			}
		},
	}
</script>
 
<style>
	.tabbar {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 100rpx;
		z-index: 999;
		background: #FFFFFF;
		border-top: 2rpx solid #FFFFFF;
	}
 
	.navigator {
		display: flex;
		justify-content: space-around;
		width: 85%;
		margin: 0 auto;
		padding: 20rpx;
	}
 
	.navigator-item {
		display: flex;
		align-items: center;
		flex-direction: column;
		width: 50rpx;
		height: 100%;
	}
 
	.item-text {
		margin-top: 12rpx;
		color: #777E86;
		font-size: 24rpx;
	}
 
	.text-active {
		color: #2E92FD !important;
	}
 
	.icon {
		width: 40rpx;
		height: 40rpx;
	}
</style>