vue2向springboot传值接收不到的解决方法

 更新时间:2023年07月09日 16:20:43   作者:苏禾呀  
本文主要介绍了vue2向springboot传值接收不到的解决方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

我们在开发项目时,经常会前后端分离,这样方便开发和测试。但是前后端分离也会导致许多的BUG出现。

这是一段vue2代码:

let url = this.urls.search + "/" + this.currentPage + "/" + this.pageSize;
axios({
    method: "POST",
    url: url,
    data: this.searchForm
}).then((res) => {
    if (res.status === 200) {
      this.loading = false;
      this.menuList = res.data.data;
    } else {
        this.$message({
        type: 'error',
        message: res.data.msg
      });
    }
}).catch((error) => {
    console.log(error);
    this.loading = false;
    this.$message.error("服务器异常,请稍后再试");
});

这是一个常见的axios方法,其作用是进行分页+条件查询。在这个方法中,我们需要向后端传的值有currentPage(当前页码)、pageSize(一页数据条数)和查询的对象。我们再来看后端代码:

    @PostMapping("/list")
    public Result<List<BusinessVO>> list(Integer pageIndex, Integer pageSize, BusinessDTO businessDTO) {
        return Result.getSuccessResult(businessService.list(pageIndex, pageSize, businessDTO));
    }

这是后端controller层的方法,通过url来实现方法的调用。

但是这样写的话,会发现一个问题:前端的参数后端(controller)接收不到。

原因是在接收前端的参数时需要在后端参数前加注解。正确代码如下:

    @PostMapping("/list/{pageIndex}/{pageSize}")
    public Result<List<BusinessVO>> list(@PathVariable Integer pageIndex, @PathVariable Integer pageSize, @RequestBody BusinessDTO businessDTO) {
        return Result.getSuccessResult(businessService.list(pageIndex, pageSize, businessDTO));
    }

一般传参数时,页数,页面大小等和数据库无关的字段会直接加在url上,@PostMapping("/list/{pageIndex}/{pageSize}") 在这里加上这两个参数,在参数前面加上@PathVariable注解;前端直接把这两个参数加在url后面即可this.urls.search + "/" + this.currentPage + "/" + this.pageSize。

而条件查询的参数一般不外显,直接使用@RequestBody会更方便,前端数据放在data里面。

注意:在使用@RequestBody注解时,方法必须使用@PostMapping(POST请求)!!!如使用@GetMapping(Get请求)则会报错!!!

到此这篇关于vue2向springboot传值接收不到的解决方法的文章就介绍到这了,更多相关vue2 springboot传值内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • java IP归属地功能实现详解

    java IP归属地功能实现详解

    前一阵子抖音和微博开始陆续上了IP归属地的功能,引起了众多热议,有大批在国外的老铁们开始"原形毕露",被定位到国内来,那么IP归属到底是怎么实现的呢?那么网红们的归属地到底对不对呢
    2022-07-07
  • JAVA调用SAP WEBSERVICE服务实现流程图解

    JAVA调用SAP WEBSERVICE服务实现流程图解

    这篇文章主要介绍了JAVA调用SAP WEBSERVICE服务实现流程图解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-10-10
  • 详解jdbc实现对CLOB和BLOB数据类型的操作

    详解jdbc实现对CLOB和BLOB数据类型的操作

    这篇文章主要介绍了详解jdbc实现对CLOB和BLOB数据类型的操作的相关资料,这里实现写入操作与读写操作,需要的朋友可以参考下
    2017-08-08
  • ThreadLocal数据存储结构原理解析

    ThreadLocal数据存储结构原理解析

    这篇文章主要为大家介绍了ThreadLocal数据存储结构原理解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-10-10
  • Spring Cloud整合XXL-Job的示例代码

    Spring Cloud整合XXL-Job的示例代码

    这篇文章主要介绍了springcloud整合xxl-job的示例代码,主要分为四个过程,本文给大家介绍的非常详细,需要的朋友可以参考下
    2023-05-05
  • springboot中@Async默认线程池导致OOM问题

    springboot中@Async默认线程池导致OOM问题

    这篇文章主要介绍了springboot中@Async默认线程池导致OOM问题,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-06-06
  • Java观察者模式的深入了解

    Java观察者模式的深入了解

    这篇文章主要为大家介绍了Java观察者模式,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
    2022-01-01
  • springboot如何通过SSH连接远程服务器

    springboot如何通过SSH连接远程服务器

    这篇文章主要介绍了springboot如何通过SSH连接远程服务器问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-07-07
  • Flowable ReceiveTask使用场景分析

    Flowable ReceiveTask使用场景分析

    这篇文章主要为大家介绍了Flowable ReceiveTask使用场景分析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-10-10
  • maven 在执行package,install,deploy时使用clean与不使用clean的不同之处

    maven 在执行package,install,deploy时使用clean与不使用clean的不同之处

    有时候用mvn install后,新改的内容不生效,一定要后来使用mvn clean install 才生效,由于之前没有做记录,以及记不清是什么情况下才会出现的问题,于是想看看clean和不clean的区别,感兴趣的朋友跟随小编一起看看吧
    2021-08-08

最新评论