axios发送post请求，后台如何接受问题

以你之姓@ 2022-05-19 05:24 285阅读 0赞

在WebStorm 中使用vue，在vue下不能使用ajax，所以使用axios。

需要使用两个包：

<script  type="text/javascript" src="../js/axios.min.js"></script>
        <script  type="text/javascript" src="../js/vue-resource.js"></script>

另外的vue的包和jQuery的包：

<script type="text/javascript" src="../js/jquery.min.js"></script>
        <script type="text/javascript" src="../js/vue.min.js"></script>

代码如下

var vue=new Vue({
                    "el":"#app",
                    "data":{
                      "student":students
    
                    },
                    "methods":{
                      "submit":function(id){
                            var theid=id;
                            var name=this.student.name;
                            var age=this.student.age;
                            var sex=this.student.sex;
                            //使用这种方式传递参数
                            let params = new URLSearchParams();
                            params.append('id', theid);
                            params.append('name', name);
                            params.append('age', age);
                            params.append('sex', sex);
    
                          axios.post('http://localhost:8080/springmvc0719/studentJson/edit',
                                    params
                            ).then(function(res){
                               window.location.href="list.html";
                            }).catch(function(err){
                               window.location.href="list.html";
                            });
                        }
                    }
                });

后台接收：

后台接收参数： @RequestParam Integer id

*@RequestMapping(value="/edit")
    	@ResponseBody
    	public int edit(@RequestParam Integer id,@RequestParam String name,@RequestParam Integer age,@RequestParam String sex){
    		Student student=new Student();
    		student.setId(id);
    		student.setName(name);
    		student.setAge(age);
    		student.setSex(sex); 
    		return studentService.update(student);
    	}

发表评论取消回复

表情：

评论列表（有 0 条评论，285人围观）

还没有评论，来说两句吧...

相关阅读

相关 axios—使用axios请求REST接口—发送get、post、put、delete请求

文档：[GitHub - axios/axios: Promise based HTTP client for the browser and node.js][GitHub

柔光的暖阳◎/ 2024年04月06日 13:20/ 0 赞/ 74 阅读

相关学习笔记——Vue+express+axios发送post请求时遇到的问题

> 问题：在使用Vue+express+axios实现项目前后端交互的过程中，通过axios中的post请求向后台传递数据，但是后台无法识别data中的数据。 > > 解决：

╰+攻爆jí腚メ/ 2023年01月17日 07:33/ 0 赞/ 163 阅读

相关 Vue axios 发送 get 和 post 请求

发送 get 请求 this.axios.get('/rebar/produceTask/selectProProduceTaskItemList',{ params

谁践踏了优雅/ 2022年11月01日 04:22/ 0 赞/ 253 阅读

相关 Postman 发送 post 请求,服务器接受到的却是 get 请求

注意一下 http 和 https 。有可能是因为服务器做了 http 强制跳转 https 。 postman 发出的 POST 遇到 301 之后就会变成 GET 。

系统管理员/ 2022年09月01日 14:54/ 0 赞/ 202 阅读

相关 axios发送post请求，后台如何接受问题

在WebStorm 中使用vue，在vue下不能使用ajax，所以使用axios。需要使用两个包： <script type="text/javascript"

以你之姓@/ 2022年05月19日 05:24/ 0 赞/ 286 阅读

相关 vue-axios post请求发送的数据后台无法接受到的问题

this.axios.post(`http://blog2.test/Home/Index/update`,this.data) 我们这样向后台发送数据，后台接受不到

た入场券/ 2022年04月11日 12:06/ 0 赞/ 240 阅读

相关 vue+axios post请求

vue+axios post请求 axios 全局默认配置 axios.defaults.baseURL = 'https://api.example.com';

淩亂°似流年/ 2022年04月10日 13:19/ 0 赞/ 336 阅读

相关 post请求内容过大，后台接受数据为null问题解决

tomcat配置文件server.xml中添加如下 URIEncoding="utf8" maxPostSize="-1" ![watermark_typ

快来打我*/ 2022年04月02日 14:52/ 0 赞/ 420 阅读

相关解决axios跨域时，发送post请求变options的问题

mounted() { let config = { headers : { 'Content-Type':'appli

深藏阁楼爱情的钟/ 2022年02月27日 08:20/ 0 赞/ 311 阅读

相关 axios 发送post请求

目录方案一方案二方案一在node中使用axios以post的方式发送一张图片给某个server时: let data = fs.crea

浅浅的花香味﹌/ 2021年11月17日 15:22/ 0 赞/ 484 阅读