DELETE /uri/ xxx 删除 GET请求,用于向服务器发送查询数据的请求,只是查询,不会增加、修改数据,不会影响服务器上资源的内容。无论进行多少次都,执行后的结果都是一样的,具有幂等性。 PUT请求,是用于向服务器发送数据,从而改变数据,修改数据内容。但是不会增加数据的种类。无论进行多少次操作,其结果也都一样,具有幂等性。 POST请求,与PUT请求类似。都是向服务器端发送数据,但是改请求会增加数据的种类,创建新的内容。不具有幂等性。 DELETE请求,用来删除某一资源。 幂等性:幂等意味着对同一个URL的多次请求会返回一样的结果
// 前端发起POST请求
const {data:res} = await this.$http.post("addUser", this.addForm);
// 后台接收POST请求
@RequestMapping("/addUser")
public String addUser(@RequestBody User user) {
    System.out.println(user);
    user.setRole("普通用户");
    user.setState(false);
    int i = userDao.addUser(user);
    String str = i > 0 ? "success" : "error";
    return str;
// 前端发起GET请求
const {data:res} = await this.$http.get("getUpdate?id=" + id);
// 后台接收GET请求
@RequestMapping("/getUpdate")
public String getUpdateUser(int id) {
    System.out.println("编号:" + id);
    User updateUser = userDao.getUpdateUser(id);
    String users_json = JSON.toJSONString(updateUser);
    return users_json;
// 前端发起PUT请求
const {data:res} = await this.$http.put("editUser", this.editForm);
// 后台接收PUT请求
@RequestMapping("/editUser")
public String editUser(@RequestBody User user){
    System.out.println(user);
    int i = userDao.editUser(user);
    String str = i > 0 ? "success" : "error";
    return str;
  • DELETE
  • // 前台发起DELETE请求
    const {data:res} = await this.$http.delete("deleteUser?id=" + id);
    // 后台接收DELETE请求
    @RequestMapping("/deleteUser")
    public String deleteUser(int id) {
        System.out.println(id);
        int i = userDao.deleteUser(id);
        String str = i > 0 ? "success" : "error";
        return str;
    
    • 一般我们需要提交表单在 Vue 中需要表单验证
    • // 表单验证
      this.$refs.editFormRef.validate(async valid =>{
        console.log(valid);
        if( !valid ) {
          return;
        // 发起请求
        const {data:res} = await this.$http.put("editUser", this.editForm);
        console.log(res);
        if (res != "success") {
          return this.$message.error("操作失败!!!");
        this.$message.success("操作成功!!!");
        // 隐藏修改对话框
        this.editDialogVisible = false;
        this.getUserList();