不做大哥好多年 不做大哥好多年
首页
  • MySQL
  • Redis
  • Elasticsearch
  • Kafka
  • Etcd
  • MongoDB
  • TiDB
  • RabbitMQ
  • 01.GO基础
  • 02.面向对象
  • 03.并发编程
  • 04.常用库
  • 05.数据库操作
  • 06.Beego框架
  • 07.Beego商城
  • 08.GIN框架
  • 09.GIN论坛
  • 10.微服务
  • 01.Python基础
  • 02.Python模块
  • 03.Django
  • 04.Flask
  • 05.SYL
  • 06.Celery
  • 10.微服务
  • 01.Java基础
  • 02.面向对象
  • 03.Java进阶
  • 04.Web基础
  • 05.Spring框架
  • 100.微服务
  • Docker
  • K8S
  • 容器原理
  • Istio
  • 数据结构
  • 算法基础
  • 算法题分类
  • 前置知识
  • PyTorch
  • 01.Python
  • 02.GO
  • 03.Java
  • 04.业务问题
  • 05.关键技术
  • 06.项目常识
  • 10.计算机基础
  • Linux基础
  • Linux高级
  • Nginx
  • KeepAlive
  • ansible
  • zabbix
  • Shell
  • Linux内核

逍遥子

不做大哥好多年
首页
  • MySQL
  • Redis
  • Elasticsearch
  • Kafka
  • Etcd
  • MongoDB
  • TiDB
  • RabbitMQ
  • 01.GO基础
  • 02.面向对象
  • 03.并发编程
  • 04.常用库
  • 05.数据库操作
  • 06.Beego框架
  • 07.Beego商城
  • 08.GIN框架
  • 09.GIN论坛
  • 10.微服务
  • 01.Python基础
  • 02.Python模块
  • 03.Django
  • 04.Flask
  • 05.SYL
  • 06.Celery
  • 10.微服务
  • 01.Java基础
  • 02.面向对象
  • 03.Java进阶
  • 04.Web基础
  • 05.Spring框架
  • 100.微服务
  • Docker
  • K8S
  • 容器原理
  • Istio
  • 数据结构
  • 算法基础
  • 算法题分类
  • 前置知识
  • PyTorch
  • 01.Python
  • 02.GO
  • 03.Java
  • 04.业务问题
  • 05.关键技术
  • 06.项目常识
  • 10.计算机基础
  • Linux基础
  • Linux高级
  • Nginx
  • KeepAlive
  • ansible
  • zabbix
  • Shell
  • Linux内核
  • python基础

  • python模块

  • django

  • flask

  • SYL

    • day01

    • day02

    • day03

    • day04

      • 00.作业
      • 01.celery原理与组件
      • 02.celery配置与基本使用
      • 03.celery发送短信接口
      • 04.vue发送短信逻辑
      • 05.检查用户名是否使用接口
      • 06.vue检查用户名是否使用
      • 07.后端注册接口完善
    • day05

    • day06

    • day07

    • day08

    • day09

    • day10

    • day11

    • day12

  • Celery

  • 微服务

  • python
  • SYL
  • day04
xiaonaiqiang
2021-03-10

06.vue检查用户名是否使用

# 1.vue检查用户名是否重复

  • 前端函数如下,js方法代码无需更改,前端代码逻辑在components\common\lab_header.vue

  • 只需要修改components\axios_api\http.js中调用的后端地址

    • // axios.defaults.baseURL = "http://127.0.0.1:8000/"
      axios.defaults.baseURL = "http://192.168.56.100:8888/"
      
      1
      2
    // 检查用户名 是否使用
    check_username() {
      // return true  // 注释检查用户名功能

      // console.log('判断用户名')
      // console.log(this.username == '')
      var reg = new RegExp(/^[a-zA-Z0-9_-]{3,16}$/); //字符串正则表达式 4到14位(字母,数字,下划线,减号)
      // 1.判断用户名是否为空
      if (this.username == '') {
        this.username_message = '用户名不能为空'
        this.username_error = true
        return false
      }
      // 2.判断用户名 4到14位(字母,数字,下划线,减号)
      if (!reg.test(this.username)) {
        this.username_message = '用户名格式不正确'
        this.username_error = true
        return false
      } else {
        // 去后端检查用户名使用数量
        user_count({ type: 'username', data: this.username }).then((res) => {
          console.log(res)
          if (res.data.count > 0) {
            this.username_message = '用户名已存在'
            this.username_error = true
          } else {
            this.username_message = ''
            this.username_error = false
          }
        })
      }
    },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

# 2.vue检查手机号是否重复

    // 检查手机号是否使用
    check_phone() {
      console.log('检查手机号')
      var reg = new RegExp(/^[1]([3-9])[0-9]{9}$/)
      if (this.phone == '') {
        this.phone_message = '手机号不能为空'
        this.phone_error = true
      }

      if (!reg.test(this.phone)) {
        this.phone_message = '手机号格式不正确'
        this.phone_error = true
        return false
      } else {
        // 去后端查用户数量
        user_count({ type: 'phone', data: this.phone }).then((res) => {
          console.log(res)
          if (res.data.count > 0) {
            this.phone_message = '手机号已存在'
            this.phone_error = true
          } else {
            this.phone_message = ''
            this.phone_error = false
          }
        })
      }
    },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
上次更新: 2024/3/13 15:35:10
05.检查用户名是否使用接口
07.后端注册接口完善

← 05.检查用户名是否使用接口 07.后端注册接口完善→

最近更新
01
04.数组双指针排序_子数组
03-25
02
08.动态规划
03-25
03
06.回溯算法
03-25
更多文章>
Theme by Vdoing | Copyright © 2019-2025 逍遥子 技术博客 京ICP备2021005373号
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式