<template>
	<view class="page">
		<view class="swiper-container">
			<view class="swiper-page" v-if="currentIndex == 0">
				
			</view>
			<view class="swiper-page" v-if="currentIndex == 1">
				<de-livery></de-livery>
			</view>
			<view class="swiper-page" v-if="currentIndex == 2">
				<my-center></my-center>
			</view>
		</view>
		<tab-bar :width="width" @tab-index="changeIndex" :currentIndex="currentIndex"></tab-bar>
	</view>
</template>

<script>
	import tabBar from "@/components/tab-bar/tab-bar.vue";
	import deLivery from "@/components/tab-bar/delivery.vue";
	import myCenter from "@/components/tab-bar/myCenter.vue";
	export default {
		data() {
			return {
				width: 0,
				currentIndex: 0,
			}
		},
		components: {
			tabBar,
			deLivery,
			myCenter
		},
		onShow() {
			let that = this
			uni.getSystemInfo({
				success: function(info) {
					that.width = info.screenWidth * 2;
				}
			});
		},
		onLoad() {
			
		},
		methods: {
			//底部tab切换组件状态改变
			changeIndex(index) {
				this.lastIndex = this.currentIndex
				this.currentIndex = index
			}
		}
	}
</script>

<style>
	@import url("./index.css");
</style>