VUE非同步檢查使用者名稱和手機號(6)
阿新 • • 發佈:2020-10-07
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/"
-
// 檢查使用者名稱 是否使用 check_username() { console.log('判斷使用者名稱') console.log(this.username == '') var reg = new RegExp(/^[a-zA-Z0-9_-]{3,16}$/); //字串正則表示式 4到14位(字母,數字,下劃線,減號) if (this.username == '') { this.username_message = '使用者名稱不能為空' this.username_error = true return false } 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 } }) } },
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 } }) } },