SpringBoot开发——常用的几种参数传递和参数接收方式

一、参数传递的四种方式

1、params传参

params传参的格式是http://xxx?参数名=值&参数名=值。
例如：

http://localhost:8080/getUserList?name=张&age=20

2、地址栏传参

直接通过/在地址上拼接参数值，这种方式不需要在地址栏上写参数名，后端只需要知道他在地址的哪个位置传的参数就可以拿到值！
例如：

//20241001为传递的参数
http://localhost:8080/getUserInfo/20241001

3、body表单传参

body表单传参，就是请求体传参。form-data的请求是在body中，为key=value格式，同时可以传文件，Content-Type为multipart/form-data，后端可以用@RequestParam接收。

4、json传参

json传参也是在body当中，只不过json是一种数据格式，后端可以用@RequestBody接收。

二、params传参的接收方式

前端params传参的示例代码：

const getUserList = () => {
    axios.get('http://localhost:8080/api/getUserList?name='+ name + '&age=' + age)
        .then((response) => {
            // 请求成功，处理数据
        })
}

如果参数比较多，也可以用以下代码：

const getUserList = () => {
    axios.get('http://localhost:8080/api/getUserList', {
        params: {
            name: name,
            age: age,            
            currentPage: current,
            sizePerPage: size
        }
    }).then(res => {
        ......
    })
};

后端接收代码：

    @GetMapping("/getUserList")
    public ApiResult getUserList(String name, int age, int current, int size){
        System.out.println(name+" , "+age " , " +current+" , "+size);
        // TODO other code
    }

此方式使用场景：
1、GET方式获取特定条件的信息查询

三、地址栏传参的接收方式

前端地址栏传参的示例代码：

const getUserInfo = (userId) => {
    axios.get('http://localhost:8080/api/getUserInfo/' + userId)
    	.then(res => {
        	......
    	})
}

后端接收代码：

	@GetMapping("/getUserInfo/{userId}")
    public ApiResult getUserInfo(@PathVariable("userId") Integer userId){
        System.out.println("getUserInfo: "+userId);
        // TODO ......
    }

此方式的适用场景
1、GET方式获取符合某ID值的对象信息，用于查询显示
2、DELETE方式获取符合某ID值的对象，用于删除场景

DELETE方式的示例
前端：

const deleteUser = (userId) => {
   axios.delete('http://localhost:8080/api/deleteUser/' + userId)
        .then((response) => {
          ......
   })
 }

后端：

	@DeleteMapping("/deleteUser/{userId}")
    public ApiResult deleteStudent(@PathVariable("userId") Integer userId){
        System.out.println("deleteUser: "+userId);
        // TODO ......
    }

四、json传参的接收方式

前端地址栏传参的示例代码：

const form = ref({
})

const saveUser = () => {
    axios.post("http://localhost:8080/api/saveUser", form.value).then(res => {
        ......
    })
}

后端接收代码:

public class User {

    private String name;

    private int age;
    ......
	
	// Getter()、 Setter()、ToString()
}

	@PostMapping("/saveUser")
    public ApiResult saveUser(@RequestBody User user){
        System.out.println("saveUser: "+user.toString());
        //TODO ......
    }

此方式的适用场景
1、POST方式用于增加一个对象信息
2、PUT方式用于更新一个对象信息

PUT方式的示例：
前端：

const form = ref({
})

const updateUser = () => {
  axios.put('http://localhost:8080/api/updateUser', form.value).then(res => {
      ......
    })
}

后端：

public class User {

    private String name;

    private int age;
    ......
	
	// Getter()、 Setter()、ToString()
}

	@PutMapping("/updateUser")
    public ApiResult updateUser(@RequestBody User user){
        System.out.println(user.toString());
        // TODO ......
    }