jch-wx_tmsaip/pages/homePage/home/home.vue

<template>
	<view class="container">
			<swiper class="main"  :autoplay="false" :current="currentPage" :duration="duration" easing-function="linear" @change="changeSwiper">
				<swiper-item>
					<manifest></manifest>
				</swiper-item>
				<swiper-item>
					<moveTrace></moveTrace>
				</swiper-item>
				<swiper-item>
					<index @changeTab="getChangeTab"></index>
				</swiper-item>
				<swiper-item>
					<vgm></vgm>
				</swiper-item>
				<swiper-item>
					<mine></mine>
				</swiper-item>
			</swiper>
		<tabBar :current="currentPage" @change="changePage"></tabBar>
	</view>
</template>

<script>
	import tabBar from "@/components/tabBar/tabBar.vue"
	import index from "@/pages/homePage/index/index.vue"
	import mine from "@/pages/homePage/mine/mine.vue"
	import manifest from "@/pages/homePage/manifest/manifest.vue" // 航运
	import moveTrace from "@/pages/homePage/moveTrace/moveTrace.vue" // 运踪
	import vgm from "@/pages/homePage/vgm/vgm.vue"

	import {
		getUserInfo
	} from '@/common/js/api/homePage/login.js'

	import {
		mapState,
		mapActions
	} from 'vuex';
	export default {
		components: {
			tabBar,
			index,
			mine,
			manifest,
			moveTrace,
			vgm
		},
		data() {
			return {
				currentPage: 2,
				duration: 200
			}
		},
		computed: {
			...mapState([
				'userInfo'
			]),
		},
		onLoad() {
			if (!uni.getStorageSync('userToken')) {
				getApp().globalData.isLogin = false;
				console.log('== 当前登录状态 ==', getApp().globalData.isLogin)
			} else {
				this.getUserInfo();
			}
		},
		methods: {
			...mapActions([
				'setUserInfo'
			]),
			changePage(index) {
				this.currentPage = index;
			},
			getUserInfo() {
				getUserInfo().then(res => {
					if(res.code == 200){
						console.log('== 获取到个人信息 ==', res.data);
						this.setUserInfo(res.data);
					}
				})
			},
			getChangeTab(type) {
				this.currentPage = type;
			},

			changeSwiper(e){
				this.currentPage = e.detail.current;
			}
		}
	}
</script>

<style lang="less">
	.container {
		height: 100vh;
		padding-bottom: 140rpx;
		display: flex;
		flex-direction: column;

		.main {
			flex: 1;
		}
	}
</style>