uni-app 前后端实战课 - 《悦读》学习笔记：【封装全局登录检查函数并部署】小程序开发实例教程2/

接上一篇

1、在 main.js 中封装全局登录函数

Vue.prototype.checkLogin = function(backpage, backtype){
	var SUID  = uni.getStorageSync('SUID');
	var SRAND = uni.getStorageSync('SRAND');
	var SNAME = uni.getStorageSync('SNAME');
	var SFACE = uni.getStorageSync('SFACE');
	if(SUID == '' || SRAND == '' || SFACE == ''){
		uni.redirectTo({url:'../login/login?backpage='+backpage+'&backtype='+backtype});
		return false;
	}
	return [SUID, SRAND, SNAME, SFACE];
}

参数说明

backpage, backtype 2个参数分别代表：
backpage : 登录后返回的页面
backtype : 打开页面的类型[1 : redirectTo 2 : switchTab]

返回值说明

已经登录返回数组 [用户 id, 用户随机码, 用户昵称, 用户表情]

2、创建 login 页面

并写个函数打印传递的变量
login 页面作为登录过度页面，多端登录都通过此页面完成!

3、在页面中应用登录检查函数，如 write.vue

<script>
    var loginRes;
    export default {
        data() {
            return {

            }
        },
        onLoad: function() {
            loginRes = this.checkLogin('../my/my', '2');
            if (!loginRes) {
                return;
            }
        }
    }
</script>

return 或终止函数运行哦！

把write页面和my页面都加上这个代码

调试

完成之后。可以调试一下。看是否报错。是否有结果

代码：

main.js

import Vue from 'vue'
import App from './App'

Vue.config.productionTip = false
// 封装全局登录函数
Vue.prototype.checkLogin = function(backpage, backtype){
	var SUID  = uni.getStorageSync('SUID');
	var SRAND = uni.getStorageSync('SRAND');
	var SNAME = uni.getStorageSync('SNAME');
	var SFACE = uni.getStorageSync('SFACE');
	if(SUID == '' || SRAND == '' || SFACE == ''){
		uni.redirectTo({url:'../login/login?backpage='+backpage+'&backtype='+backtype});
		return false;
	}
	return [SUID, SRAND, SNAME, SFACE];
}
App.mpType = 'app'

const app = new Vue({
    ...App
})
app.$mount()

 

login.vue

<template>
	<view>
		longin...
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		onLoad:function(options){
			console.log(options);
		}
	}
</script>

<style>

</style>

write.vue

<template>
	<view>
		write...
	</view>
</template>

<script>
	var loginRes;
	export default {
		data() {
			return {

			}
		},
		onLoad: function() {
			loginRes = this.checkLogin('../write/write', '2');
			if (!loginRes) {
				return;
			}
		}
	}
</script>

<style>

</style>

my.vue

<template>
	<view>
		my...
	</view>
</template>

<script>
	var loginRes;
	export default {
		data() {
			return {

			}
		},
		onLoad: function() {
			loginRes = this.checkLogin('../my/my', '2');
			if (!loginRes) {
				return;
			}
		}
	}
</script>

<style>

</style>