前端url请求中 非必填参数如何校验处理？

问题遇到的现象和发生背景 现在要做一个报表打印的功能，通过在前端输入相对应的条件（有必填和非必填）传到报表服务器（sql）处理查询出结果
问题相关代码，请勿粘贴截图

async printAllowance(lMatnAlwnCrtfDFormQuery) {
let baseUrl =
'http://172.16.240.21:8080/unireport/Report-ResultAction.do?reportId=%27

  let reportId = 'REPORT-C9BC2E5630A00001CCACBB81E1FD13B8'
  debugger
  const rpotUrl = `${baseUrl}${reportId}&CERTNO=${lMatnAlwnCrtfDFormQuery.certno}&EMPNO=${lMatnAlwnCrtfDFormQuery.empNo}`

  console.log('rpotUrl:' + rpotUrl)
  this.rpotArr = rpotUrl
  this.drawerShow = true
},
运行结果及报错内容

img


我通过这种&拼接的形式将各个参数拼接，目前只拼接了两个非必填的尝试，

img


img


身份证号和单位编号两个都传入报表结果可以正常显示

img

img

只传入一个的话 由于单位编号未定义，数据就显示不了了

我的解答思路和尝试过的方法

尝试过将这些所有必填和非必填的参数都放入一个data里面 非必填的就给个空 有值了再赋上

我想要达到的结果

这种拼接的写法 当非必填的成为未定义的时候 如何校验 处理一下？传入一个身份证号也能正常显示？前端有点菜，各位专家们多多指教一下，谢谢

问题很简单呀，你就把那两个非必填设置成必填不就好了，如果你不会设置就比葫芦画瓢啊，其他必填是怎么来的你就怎么搞

建议看下后端是怎么处理的，当你有条件传空时，后端是否能正确返回数据？
如果不能返回，说明这是后端查数据库的问题；
如果返回正确了，那你前端取返回的数据就好了

另外，前端、后端必须要遵从相同的逻辑，比如这玩意到底是可以返回多行还是只能返回一行？

你报表服务器就是后端，必须要确定一下它sql的where条件是怎么写的，有这样两种情况

  1. 如果是不传参数就不拼接对应条件，这个最好处理
  2. 不管传不传参数都会拼接所有条件，那么必须让sql中拼接的条件变成类似下面这个样子
    where 字段=ifnull(参数,字段)

url这一部分的话，其实就是一个字符串拼接，你可以对每个可为空的参数，写个if判断逻辑，当参数不为空时，才把这个参数给拼上去

传给后端的时候 编号默认给个时间戳
三元判断一下
num?num:new Date().getTime() 正常该回显回显