搜索用户名和手机号用同一个输入框
分析需求,输入用户名或者手机号,点击搜索用户按钮进行搜索,通过判断值是否为手机号进行传值
接口:
将这两个值传过来的时候封装在一个对象里面,传给后台的时候拆分为两个
export const mailUserList2 = ({realName,phone}) => {
return request({
url: '/api/blade-user/mailUserList',
method: 'get',
params: {
realName,
phone
}
})
}
搜索用户按钮的点击事件
//搜索用户
searchUsers(){
// 这个不重要
this.flag = false
let params = {};
// let isp = true
//判断输入的值是否为手机号,是就是true
if(this.verificationPhone()){
// isp = true
//为true就把params对象里面的phone赋值,this.input就是input框的值
params.phone = this.input
}else{
// isp = false
params.realName = this.input
}
//isp ? null : this.input,isp ? this.input : null
mailUserList2(params).then(res=>{
this.userFormData = res.data.data.records
})
},
//校验手机号
verificationPhone() {
//这里的this.input就是输入框的值,进行校验是否为手机号
if(/^((1[3,5,8,7,9][0-9])|(14[5,7])|(17[0,6,7,8])|(19[1,7]))\d{8}$/.test(this.input)){
return true
}else {
return false ;
}
},
第二种方法,就是我刚才那个注释的地方,进行三木表达式的判断
//搜索用户
searchUsers(){
this.flag = false
let params = {};
let isp = true
if(this.verificationPhone()){
isp = true
params.phone = this.input
}else{
isp = false
params.realName = this.input
}
//如果isp是true,就说明是手机号,那么久给这个realname变成null,传phone就行了
mailUserList2(isp ? null : this.input,isp ? this.input : null).then(res=>{
this.userFormData = res.data.data.records
})
},