如何用vue实现单页面登录注册功能

  • Z时代
  • 2024-02-29
  • 分类：IT

如何用vue实现单页面登录注册功能

1、“账号”和“密码”输入框，“登录”按钮；
2、输入框无内容按钮无法点击；
3、输入框仅能输入数字，否则弹窗提示特定信息；
4、输入指定合法用户信息时。当信息校验成功提示成功信息，否则提示错误信息。

初学vue，不会实现第2和第3.求大佬教学。

回答：

比如：账号：name, 密码：password
2、登录按钮增加属性 :disabled="!(name.length && password.length)"
3、输入框用的是input的话，仅能输入数字，可以用type="number"限制。这样用户只能输入数字，也可以减少这些判断。

如果一定要判断提示的话，在点击登录的单击事件上，用正则去处理：
例如：

login() {
    const reg = /^[0-9]*$/
    if (!reg.test(password) || !reg.test(name)) {
        // 这里弹窗显示
    }
}

回答：

  1. 给按钮加 :disabled="!value.length" 的判断。
  2. 在提交方法做

以上是 如何用vue实现单页面登录注册功能 的全部内容， 来源链接： utcz.com/p/936621.html

回到顶部