iis服务器助手广告广告
返回顶部
首页 > 资讯 > 服务器 >详解axios四种传参,后端接参
  • 934
分享到

详解axios四种传参,后端接参

服务器前端javascript 2023-08-31 22:08:27 934人浏览 八月长安
摘要

详解axiOS四种传参,后端接参 方式一、通过data字段将JSON数据发送到后台(用","发送数据) //格式:axios.delete(服务器链接,{data:{键:值}})axios.delete("/delete" , {data:

详解axiOS四种传参,后端接参

方式一、通过data字段将JSON数据发送到后台(用","发送数据)

//格式:axios.delete(服务器链接,{data:{键:值}})axios.delete("/delete" , {data:{aid:row.aid}}).then(resp => {    let resultInfo = resp.data;    })

前端浏览器发送的数据

后端接参

@RequestBody指定接收的是json格式的参数,然后参数类型是Map类型,通过map的键取出数据。

@DeleteMapping("/delete")public ResultInfo delete(@RequestBody Map params) {    System.out.println(params.get("aid"));    return new ResultInfo(true);}

后端服务器接收的数据:{aid=11}

方式二、通过params字段将json数据发送到后台(用","发送数据),实际上是在网址上做拼接。

// 格式:axios.delete(服务器链接,{params:{键:值}})axios.delete("/delete" , {params:{aid:row.aid}}).then(resp => {    let resultInfo = resp.data;    })

前端浏览器发送的数据

后端接收:

@RequestBody指定接收的是json格式的参数,然后参数可以通过名字自动匹配

@DeleteMapping("/delete")public ResultInfo delete(Integer aid) {System.out.println(aid);    return new ResultInfo(true);}

 参数名不一致则用@RequestParam("前端传过来的参数名") 做匹配

@DeleteMapping("/delete")public ResultInfo delete(@RequestParam("aid") Integer aaid) {    System.out.println(aaid);    return new ResultInfo(true);}

后端服务器接收的数据:107

方式三、直接在地址栏上拼接数据,且必须在拼接前加"/"

//格式:axios.delete("/服务器链接/"+值)axios.delete("/delete/"+row.aid).then(resp => {    let resultInfo = resp.data;    if (resultInfo.success) {        this.$message({            type: 'success',            message: resultInfo.message        });    }})

客户端

后端接收(服务器)

 

// 通过在 /{参数名} 得到访问方法,然后取值用@PathVariable("参数名")@DeleteMapping("/delete/{aid}")public ResultInfo delete(@PathVariable("aid") Integer aid) {    System.out.println(aid);    return new ResultInfo(true);}

方式四、传统方式?参数名=参数值

 

axios.delete("/delete?aid="+row.aid).then(resp => {    let resultInfo = resp.data;})

 服务器直接接收,按名字匹配,如果名字不一致,则用@RequestParam进行匹配

@DeleteMapping("/delete")public ResultInfo delete(Integer aid) {    System.out.println(aid);    return new ResultInfo(true);}

注: get和delete几乎完全一致

 

来源地址:https://blog.csdn.net/weixin_56602545/article/details/130001392

--结束END--

本文标题: 详解axios四种传参,后端接参

本文链接: https://www.lsjlt.com/news/387257.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作