【Vue3】请求参数

1. x-www-form-urlencoded

请求方式：POST

name=John&age=25

export const userRegisterService = (registerData) => {
    // 直接传入会是 json 格式
    // URLSearchParams 将 json 格式转为 x-www-form-urlencoded 格式
    const params = new URLSearchParams();
    for (let registerDataKey in registerData) {
        params.append(registerDataKey, registerData[registerDataKey])
    }
    return request.post('/user/register', params)
}

const registerData = ref({
  username: '',
  password: '',
  rePassword: ''
})

    @PostMapping("/register")
    public Result register(@Pattern(regexp = "^\\S{5,16}$") String username, @Pattern(regexp = "^\\S{5,16}$") String password) {
        User u = userService.findByUserName(username);
        if (u == null) {
            userService.register(username, password);
            return Result.success();
        } else {
            return Result.error("用户名已被占用");
        }
    }

    let url = new URL("https://example.com?foo=1&bar=2");
    let params = new URLSearchParams(url.search.slice(1));

    //Add a second foo parameter.
    params.append("foo", 4);
    console.log(params);
    //Prints URLSearchParams {size: 3}
    console.log(params.toString());
    //Prints 'foo=1&bar=2&foo=4'.

2. queryString

/api/users?id=12345&name=John

export const userAvatarUpdateService = (avatarUrl) => {
    const params = new URLSearchParams()
    params.append('avatarUrl', avatarUrl)
    return request.patch('/user/updateAvatar',params)
}

或者也可以直接拼接字符串，比如：

export const articleCategoryDeleteService = (id) => {
    return request.delete('/category?id=' + id)
}

3. JSON

/api/users?filter={"role":"admin","status":"active"}