layui表格GET请求url地址拼接参数为?{%22page%22:1,%22limit%22:20}

问题:swagger上面测试接口是有数据返回来的,本地调用接口,接口调用成功了接口返回来的数据为空。代码如下:

layui.use(['table'], function () {
      var table = layui.table
      table.render({
        elem: '#table',
        url: 'api/list',
        height: 'full-160',
        limit: 20,
        method:GET,
        page: true, //开启分页
        even: true, //开启隔行背景
        headers: {Authorization: token},
        contentType: 'application/json;charset=UTF-8',
        where: {state: status?status:'', boilerID: Code?Code:''},
        cols: [
          [
            //表头
            {
              field: 'name',
              title: '名称',
              align: 'center',
              width: 160,
            }
        ],
        done: function (res) {},
        parseData: function (res) {
          return {
            code: res.result ? 0 : -1,
            msg: res.msg,
            count: res.total,
            data: res.data
          }
        }
      })
    })
 

通过百度搜索发现是把特殊字符转义了,后来通过修改contentType为'text/xml;application/json;charset=UTF-8'效果如下:

//没修改contentType值时的效果

url地址:api/list?{%22page%22:1,%22limit%22:20}

//修改之后为

url地址:api/list?page=1&limit=20

此时还存在一个问题,接口有可选参数。可选参数初次是不允许传任何数据的包括空值,否则接口会报错400。(可以问下后端看能不能更改下)

前端代码修改如下:

table.render({
        elem: '#table',
        //修改如下:
        url: 'api/list'+(status?(status?('?state='+status):'')+(Code?('&boilerID='+Code):''):(status?('&state='+status):'')+(Code?('?boilerID='+Code):'')),
        height: 'full-160',
        limit: 20,
        page: true, //开启分页
        even: true, //开启隔行背景
        headers: {Authorization: token},
        contentType: 'text/xml;application/json;charset=UTF-8',
        //where: {state: status?status:'', boilerID: Code?Code:''},  改行代码已注释
        cols: [
          [
            //表头
            {
              field: 'name',
              title: '名称',
              align: 'center',
              width: 160
            }
          ]
        ],
        done: function (res) {},
        parseData: function (res) {
          return {
            code: res.result ? 0 : -1,//这里必须为0或-1,因为接口返回的是boolean值导致数据不在表格上面渲染
            msg: res.msg,
            count: res.total,
            data: res.data
          }
        }
      })
 

用的笨办法,好在全部问题都解决了。如果你有更好的解决方案,欢迎留言。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值