【前端实习日记（1）】遍历对象/vben admin搜索功能实践

*写在开头：本人转码小菜鸡，此日记为实习期间学习记录，会删除一切无礼评论，当然也欢迎大佬交流指正！> *

目前正在使用的开源项目框架是：vben admin 今天遇到的需求是：1.获取搜索框内的字段，拼接字段，发送请求(如图例)

（1）获取字段：vben admin 提供了beforefetch方法，可以在请求之前对参数进行处理。用beforefetch方法是我认为在vben admin的basictable组件里开发搜索功能最方便的方法。 beforefetch:(p)=>{ console.log(p) } log方法提供的p之后，可以得到搜索框内的字段（如果有输入的话，没有输入就是undefined） 同时p里面还有基本的page和pageSize，供请求的同时使用分页功能。 那么这时候我们就可以把p传给写好的api，在api里面可以使用一些数组以及对象的遍历方法来拼接字段。 这时，我会创建一个新的对象放page和pageSize，同时，把对象p里面undefined的属性给过滤掉（删除），我是直接遍历对象。 如：

var obj1={
AMT:undefined,
DES:undefined,
OPP_NAME:undefined,
PARTY_CHN_NAME:undefined,
PARTY_ID:"123124",
page:1,
pagesize:10
}
let obj2 = {}
obj2.page=obj1.page
obj2.pagesize=obj1.pagesize
Object.keys(obj1).forEach((item)=>{
  const key = obj1[item];
  if (key === undefined || key === "") {
    delete obj1[item]
  }
  delete obj1.page
  delete obj1.pagesize
})

这样，就得到了只有实值属性的对象了。 { PARTY_ID: '123124' } 因为我发送请求最后是要写成字符串的这种格式的：+PARTY_ID='123124',要把这一串拼进整个请求的参数（params）里。

//把对象遍历成数组
let arr1 = []
Object.keys(obj1).forEach((item)=>{
  arr1.push(`${item}='${obj1[item]}'`)
})
console.log(arr1);
//[ "PARTY_ID='123124'" ]
let searchSting = arr1.join(' OR ')

最后，用了join方法联结数组里的字符串，这样，有多个搜索词输入也可以拼接成字符串了。

另外，今天还学了一些mysql的基本操作，很神奇的是，我们组长竟然用encryptByBase64方法包裹sql发送了请求，让我大开眼界。 好的，我们下次再记录吧。