页面自动刷新和注册逻辑问题
rt,代码如下:
<template> <div> <form v-if="!isReg"> <label for="name1">User Name: </label> <input type="text" id="name1" v-model="name"><br> <label for="pwd1">Password: </label> <input type="password" id="pwd1" v-model="pwd"><br> <button @click="login()">Login</button> <button @click="reg()">register</button> </form> <form v-else> <label for="name2">User Name: </label> <input type="text" id="name2" v-model="name"><br> <label for="pwd2">Password: </label> <input type="password" id="pwd2" v-model="pwd"><br> <label for="pwda">Password Again: </label> <input type="password" id="pwda" v-model="pwda"><br> <button @click="confirm()">confirm register</button> <button @click="cancel()">cancel register</button> </form> </div> </template>
login() { this.$router.push('home') }, reg() { this.isReg = true }, cancel() { this.isReg = false }, confirm() { if(this.pwd === this.pwda && this.name !== '' && this.pwd !== '') { localStorage.setItem('name',this.name) localStorage.setItem('pwd',this.pwd) this.name = '' this.pwd = '' this.isReg = false } else { alert("两次输入不一致") } }
没有报错,问题在于点击任意按钮时页面都会自动刷新,这就导致点击注册时,注册表单一闪而过刷新回登录,此时url为localhost:8080/?,我重启服务、浏览器都没有用。
还有最后这个confirm函数,空信息注册会弹窗,但是localstorage也会存数据,相当于两个分支都走了一遍,有点不可思议,是我判断的条件有问题吗?
有点懵,还请赐教。