使用vue做一个简单的登录页面(本地)
账号:v-model是双向数据绑定语法糖t<div class="form-group form-inline"><label for="username">登录名称</label><inputtype="text"class="form-control ml-2"id="username"placeholder=
·
账号:
v-model是双向数据绑定语法糖
t
<div class="form-group form-inline">
<label for="username">登录名称</label>
<input
type="text"
class="form-control ml-2"
id="username"
placeholder="请输入登录名称"
autocomplete="off"
//绑定用户名
//trim属性:去除两边空格
v-model.trim="username"
/>
</div>
密码验证::
<div class="form-group form-inline">
<label for="password">登录密码</label>
<input
type="password"
class="form-control ml-2"
id="password"
placeholder="请输入登录密码"
v-model.trim="password"
/>
</div>
数据流:
data() {
return {
username: '',
password: ''
}
},
登录验证:
login() {
//自己设置账号 密码
if (this.username === 'admin' && this.password === '666666') {
// 登录成功
// 1. 存储 token
// 键,值
localStorage.setItem('token', 'Bearer xxxx')
// 2. 跳转到后台主页
this.$router.push('/home')
} else {
// 登录失败,清空
localStorage.removeItem('token')
}
}
token运行情况
更多推荐
已为社区贡献1条内容
所有评论(0)