一,前端参数拼接

本次发送请求采用了将参数拼接到URL后面的方法

deleteUser (userId) {
    return caseRequest.request({
      url: '/user/deleteUser/' + userId,
      method: 'DELETE',
      headers: { 'Content-Type': 'application/json' }
    })
  }

这里axios发送请求封装了一下,便于使用,封装的也很简单,安装好Axios和vue-axios,在man.js里引入,随后在需要用到axios的地方导入就可以,为了简化代码可以先配置好baseURL,有需要的还可以配置超时时间

import axios from 'axios'
const caseRequest = axios.create({
  baseURL: 'http://localhost:7080/tick_tack'
  // timeout: 5000
})

二,后端处理

除了前端拼接URL外,后端也需要做一定的配置

    @ApiOperation(value = "删除方法", notes = "测试数据是否删除成功")
    @DeleteMapping("/deleteUser/{userId}")
    public boolean deleteUser(@PathVariable Integer userId) {
        return userService.deleteUser(userId);
    }

@PathVariable: 获取的是请求路径中参数的值

说明

这里如果用Get请求会方便很多,但还是遵守Restful的规范比较好,以下是各个方法的说明和使用场景

  • GET请求:通过接口查询相应的数据
  • POST请求:一般用来做新增操作(第二次请求不会覆盖第一次,一般用来新增资源)
  • PUT请求:新增操作(当两次请求相同时,第二次请求会覆盖第一次,一般用来更新资源)
  • DELETE请求:删除操作
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐