前言

首先本篇写给一些有前端基础的人看

登录界面存用户名,key值为user

//调用后台的方法 登录方法
Login() {
				//axios 获取网络
				var that = this
				this.$axios.post("http://localhost:8088/xiaoxiang/findloginuser", {
					userName: this.username,
					password: this.password,
					//身份的验证
					indentity: this.value
				}).then(function(res) { //请求成功
					//回调方法里的this,只是调用方法体里面的参数,所以需要在外面将this定义好 JQuery
					if (res.data.code === 1) {
					
						// JSON.stringify将要序列化成 一个JSON 字符串的值,将值存在sessionStorage读取或保存数据中,设置key值为user
						sessionStorage.setItem("user", JSON.stringify({
							username: that.username,
						}))

						if (that.value === "admin") {
						//路由的跳转--正常跳转就行
						
						} else if (that.value === "普通用户") {
							//路由的跳转
							
						}

					} else if (res.data.code === 500) {
						alert("用户名或者密码错误,请重新输入")
						// window.location.href = 'fail.html'
					}
				}).catch(function(err) { //请求失败
					console.log(err)
				})
			},

跳转的页面获取key为user的用户名

该方法处于的位置:
在这里插入图片描述

// created:在模板渲染成html前调用,即通常初始化某些属性值,然后再渲染成视图。
		created() {
			let userName = JSON.parse(sessionStorage.getItem("user"))
			if(userName) {
				//userName.username==user.username  对应登录界面设置的key里面的value对应的数组值
				this.user = userName.username
				console.log("this.user:"+this.user)
			}
		},

在这里插入图片描述

打印的结果为

在这里插入图片描述

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐