vue.js发送get请求并携带参数到springboot后端,但后端接收不到参数的问题

一:vue.js发送get请求并携带参数到springboot后端的代码

1.错误写法:get(‘/warehouse/list’, this.queryInfo.papeNum,this.queryInfo.pageSize)

export default {
  data() {
    return {
      //获取仓库列表的参数对象
      queryInfo: {
        query: '',
        papeNum: 1, //当前页数
        pageSize: 2,  //当前每页显示条目个数
      },
    };
  },
  created() {
    this.getWarehourseList();
  },
  methods: {
    // 获取仓库列表
    getWarehourseList() {
      this.$http
        .get('/warehouse/list', this.queryInfo.papeNum,this.queryInfo.pageSize)
        .then((res) => {
          if (res.data.code == 200) {
            this.warehouselist = res.data.data.list;
          } else {
            this.$message.error('获取数据失败!');
          }
        })
        .catch(function (error) {
          console.log(error);
        });
    },
  },
};

二:正确写法如下:参数有格式要求,要写成这样{params:{papeNum: this.queryInfo.papeNum,pageSize: this.queryInfo.pageSize,}}

export default {
  data() {
    return {
      //获取仓库列表的参数对象
      queryInfo: {
        query: '',
        papeNum: 1, //当前页数
        pageSize: 2,  //当前每页显示条目个数
      },
    };
  },
  created() {
    this.getWarehourseList();
  },
  methods: {
    // 获取仓库列表
    getWarehourseList() {
      this.$http
         .get('/warehouse/list', {
           params: {
             papeNum: this.queryInfo.papeNum,
             pageSize: this.queryInfo.pageSize,
           },
         })
        .then((res) => {
          if (res.data.code == 200) {
            this.warehouselist = res.data.data.list;
          } else {
            this.$message.error('获取数据失败!');
          }
        })
        .catch(function (error) {
          console.log(error);
        });
    },
  },
};

2.springboot后端代码如下

    // 返回所有仓库
    @GetMapping(value = "/list")
    public CommonResult<CommonPage<Warehouse>> list(@RequestParam(value = "pageNum",defaultValue = "1") Integer pageNum,
                                                    @RequestParam(value = "pageSize",defaultValue = "10") Integer pageSize){
        Page page = warehouseService.list(pageNum,pageSize);        //该Page导入的包是import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
        return CommonResult.success(CommonPage.restPage(page));
    }
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值