17--vue 登录页面账号密码提交验证validator + 跳转方式

最新推荐文章于 2024-04-22 12:27:49 发布

小芹儿

最新推荐文章于 2024-04-22 12:27:49 发布

阅读量710

点赞数

分类专栏： Vue部分

本文链接：https://blog.csdn.net/xu_ze_qin/article/details/106108981

版权

本文介绍了在Vue.js中实现登录页面的账号密码验证及两种常见的数据处理方法，并展示了具体的登录页面代码示例，包括使用$router进行页面跳转的多种方式。

摘要由CSDN通过智能技术生成

跳转方式：
this.$router.replace(’/schoolmanager’).catch(res => {})

this.$router.go(-1)

this.$router.back

常用的两种处理数据的方式：
one:

		const p1 = this.$refs.validator0.validate()
				p1.then(res => {
   
					if (this.valid) {
   
						sessionStorage.setItem('number', this.new_number)
						this.$router.go(-1)
					} else {
   

					}
				})

异步调用 promise 数组filter,map,every…
two:

	Promise.all([p1, p2]).then(res => {
   })

登录页面代码：>>>

<template>
	<div class="page">
		<div class="header">用户登录</div>
		<div class="row">
			<cube-select v-model="role"  :options="roles"></cube-select>
		</div>
		<div class="row">
			<cube-validator ref="validator0" v-model="valid" :model="tel" :rules="rules[0]">
				<cube-input v-model='tel' :placeholde