Vue前后端数据交互,Post请求,后端用对象接收数据

前端axios发送请求

封装 request.js

import axios from 'axios'
export function request(config) {
    const instance = axios.create({
  	  //地址
        baseURL: 'http://**********',
        //超时设置
        timeout: 10000
    })
    instance.interceptors.request.use(config => {
        return config
    }),err => {
        return err
    }
    instance.interceptors.response.use(res => {
        return res.data
    }), err => {
        return err
    }
    //3.发起真正的网络请求
    return instance(config)
}

发送请求 login.js

//引入request.js
import {request} from "@/network/request";

 // user : {username : '1001', userpassword: 'ddd'}
export function login(user){
     return request({
        method:'post',
        url:'/findUser',
        data: user,
        
            })
}

	 // 发送数据 data:user
	 // 后端接收的是  {username : '1001', userpassword: 'ddd'}
     
      //错误格式， data: {user},
      //后端接收的是 {user : {username : '1001', userpassword: 'ddd'}}
       

后端代码

 @PostMapping("/findUser")
 //返回字符串
 //User 对象接收数据
 //username ,userpassword
    public String findUser(@RequestBody User user){
        System.out.println(user);
        return "123456";
    }