wlpx/App.vue

<script>
	/**
	 * vuex管理登陆状态，具体可以参考官方登陆模板示例
	 */
	import {
		mapMutations
	} from 'vuex';
	// #ifdef H5
	import {
		weixindata,
		weixinlocation
	} from './utils/wxAuthorized';
	// #endif
	export default {
		data() {
			return {
				/* 保存微信信息 */
				appData: {},
				weixinObj: '' //保存微信对象
			};
		},
		methods: {
			...mapMutations('user', ['setUserInfo', 'login', 'hasLogin']),
		},
		onLaunch: function(urlObj) {
			let obj = this;
			// 加载缓存中的用户信息
			let userInfo = uni.getStorageSync('userInfo') || '';
			console.log(userInfo, 'bba');
			// 判断是否拥有用户信息
			if (userInfo.uid) {
				//更新登陆状态
				uni.getStorage({
					key: 'userInfo',
					success: res => {
						obj.setUserInfo(res.data);
						obj.login(res.data);
					}
				});
			}
			// #ifdef H5
			//判断是否已经缓存浏览器
			let bool = uni.getStorageSync('weichatBrowser') || '';
			if (bool === '') {
				//判断是否为微信浏览
				bool = navigator.userAgent.toLowerCase().match(/MicroMessenger/i) == 'micromessenger';
				// 保存当前是否为微信内核浏览器
				uni.setStorageSync('weichatBrowser', bool);
			}
			if (bool) {
				// 加载微信信息
				weixindata();
			}
			// #endif

		},
		onShow: function() {
			// 加载拦截
			// console.log('App Show');
			// console.log(this.$u.config.v);
		},
		onHide: function() {
			// console.log('App Hide');
		}
	};
</script>

<style lang="scss">
	@import "uview-ui/index.scss";

	view,
	scroll-view,
	swiper,
	swiper-item,
	cover-view,
	cover-image,
	icon,
	text,
	rich-text,
	progress,
	button,
	checkbox,
	form,
	input,
	label,
	radio,
	slider,
	switch,
	textarea,
	navigator,
	audio,
	camera,
	image,
	video {
		box-sizing: border-box;
	}

	/* flex布局-整体居中 */
	.flex-center {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	/* flex布局-上下居中 */
	.flex-upDown-center {
		display: flex;
		align-items: center;
	}

	//单行排列，居中
	.flex_direction {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	//单行字体省略
	.word1_ellipsis {
		text-overflow: ellipsis; //显示 ...
		overflow: hidden; //隐藏文字
		white-space: nowrap; //不换行
	}

	//多行字体省略
	.word2_ellipsis {
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2; //在第几行显示...
		-webkit-box-orient: vertical;

	}

	//右外边距
	.m-r25 {
		margin-right: 25rpx;
	}

	.m-r15 {
		margin-right: 15rpx;
	}

	.flex1 {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.flex-start {
		display: flex;
		align-items: center;
		justify-content: flex-start;
	}

	.flex {
		display: flex;
	}

	.position-relative {
		position: relative;
	}

	/* 骨架屏替代方案 */
	.Skeleton {
		background: #f3f3f3;
		padding: 20rpx 0;
		border-radius: 8rpx;
	}

	/* 图片载入替代方案 */
	.image-wrapper {
		font-size: 0;
		background: #f3f3f3;
		border-radius: 4px;

		image {
			width: 100%;
			height: 100%;
			transition: 0.6s;
			opacity: 0;

			&.loaded {
				opacity: 1;
			}
		}
	}

	// 设置富文本中图片最大宽度
	uni-rich-text img {
		max-width: 100% !important;
	}

	/*边框*/
	.b-b:after,
	.b-t:after {
		position: absolute;
		z-index: 3;
		left: 0;
		right: 0;
		height: 0;
		content: '';
		transform: scaleY(0.5);
		border-bottom: 1px solid $border-color-base;
	}

	.b-b:after {
		bottom: 0;
	}

	.b-t:after {
		top: 0;
	}

	/* button样式改写 */
	uni-button,
	button {
		height: 80rpx;
		line-height: 80rpx;
		font-size: $font-lg + 2rpx;
		font-weight: normal;

		&.no-border:before,
		&.no-border:after {
			border: 0;
		}
	}

	uni-button[type='default'],
	button[type='default'] {
		color: $font-color-dark;
	}

	/* input 样式 */
	.input-placeholder {
		color: #999999;
	}

	.placeholder {
		color: #999999;
	}

	// 边距样式
	@for $i from 1 to 4 {
		.margin-l-#{$i * 10} {
			margin-left: $i * 10rpx !important;
		}

		.margin-r-#{$i * 10} {
			margin-right: $i * 10rpx !important;
		}

		.margin-t-#{$i * 10} {
			margin-top: $i * 10rpx !important;
		}

		.margin-b-#{$i * 10} {
			margin-bottom: $i * 10rpx !important;
		}

		.margin-#{$i * 10} {
			margin: $i * 10rpx !important;
		}

		.margin-v-#{$i * 10} {
			margin-top: $i * 10rpx !important;
			margin-bottom: $i * 10rpx !important;
		}

		.margin-c-#{$i * 10} {
			margin-left: $i * 10rpx !important;
			margin-right: $i * 10rpx !important;
		}

		.padding-l-#{$i * 10} {
			padding-left: $i * 10rpx !important;
		}

		.padding-r-#{$i * 10} {
			padding-right: $i * 10rpx !important;
		}

		.padding-t-#{$i * 10} {
			padding-top: $i * 10rpx !important;
		}

		.padding-b-#{$i * 10} {
			padding-bottom: $i * 10rpx !important;
		}

		.padding-#{$i * 10} {
			padding: $i * 10rpx !important;
		}

		.padding-v-#{$i * 10} {
			padding-top: $i * 10rpx !important;
			padding-bottom: $i * 10rpx !important;
		}

		.padding-c-#{$i * 10} {
			padding-left: $i * 10rpx !important;
			padding-right: $i * 10rpx !important;
		}
	}

	// 字体大小
	.font-size-sm {
		font-size: $font-sm;
	}

	.font-size-base {
		font-size: $font-base;
	}

	.font-size-lg {
		font-size: $font-lg;
	}

	// 字体颜色
	.font-color-yellow {
		color: $color-yellow;
	}

	.font-color-gray {
		color: $color-gray;
	}

	.font-color-red {
		color: $color-red;
	}

	// 边框颜色
	.border-color-yellow {
		border: 1rpx solid $color-yellow;
	}

	// 修改默认背景颜色
	uni-page-wrapper {
		background-color: $page-color-base;
	}

	page {
		background-color: $page-color-base;
		// 设置默认字体
		font-family: PingFang SC, STHeitiSC-Light, Helvetica-Light, arial, sans-serif, Droid Sans Fallback;
	}

	.clamp {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		display: block;
	}

	.clamp2 {
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}
</style>