## restful接口 前后台联调实例

来新公司一个半月了。老大说以后的java项目的接口风格要使用restful（动词+宾语）风格编写，之前一直使用get、post。现在改成了restful有点不是很适应，今天整理了一下vue的axios 调用java后台restful几口实例，也对以后的使用做积累，废话有点多了。。。  代码如下

## restful 前后台请求 联调

axios 封装
import axios from 'axios'
import Message from 'element-ui'
import qs from "qs";

// 创建一个 axios 实例
const service = axios.create({
  baseURL: 'http://localhost:后台端口号/',
  timeout: 5000, // 请求超时时间
})
// 请求拦截器 (默认走get请求)
service.interceptors.request.use(
  config => {

    if (config.method === 'patch') { 
      config.headers['Content-Type'] = 'application/x-www-form-urlencoded'
      config.transformRequest = [function (data) {
        console.log(data)
        data = qs.stringify(data);
        return data;
      }]
    }
    if (config.method === 'post' || config.method === 'put') {
      config.headers['Content-Type'] = 'application/json'
    }
    return config;
  },
  error => {
    // 发送失败
    console.log(error)
    return Promise.reject(error)
  }
)

后台接口 
@CrossOrigin // 跨域
@RequestMapping(value = "你的路由地址")
@GetMapping(name = "根据查询条件获取列表数据")
public Result<T> getList(T entity) {}

@GetMapping(value = "/{id}", name = "根据id获取数据")
public Result<T> getListById(@PathVariable("id") Integer id){}

@PostMapping(name = "添加数据")
public Result add(@RequestBody T entity) {}

@PutMapping(value = "/{id}", name = "根据id修改数据")
public Result updateById(@PathVariable("id") Integer id, @RequestBody T entity) {}

@PatchMapping(value = "/status/{id}", name = "根据内容id修改数据状态")
public Result updateById(@PathVariable Integer id, @RequestParam Integer status) {}
	
@DeleteMapping(value = "/{id}", name = "根据id删除数据")
public Result delById(@PathVariable("id") Integer id) {}

@DeleteMapping(name = "批量删除数据")
public Result delByIds(@RequestBody List<Integer> idList) {}

前台联调
async getList() {
  let params = {
	id: 1,
	name: "张三"
  }
  let data = await this.$axios.get("你的路由地址", { params })
  console.log(data)
  console.log("000")
},
async getListById() {
  let data = await this.$axios.get("你的路由地址/" + 1)
  console.log(data)
  console.log("000")
},
async add() {
  let params = {
	id: 1,
	name: "zhagnsan"
  }
  let data = await this.$axios.post(
	"你的路由地址",
	JSON.stringify(params)
  )
  console.log(data)
  console.log("000")
},
async update() {
  let params = {
	id: 1,
	name: "张三"
  }
  let data = await this.$axios.put(
	"你的路由地址/" + 1,
	JSON.stringify(params)
  )
  console.log(data)
  console.log("000")
},
async updateByStatus() {
  let params = {
	status: 2
  }
  let data = await this.$axios.patch("你的路由地址/" + 1, params)
  console.log(data)
  console.log("000")
},
async deleteById() {
  let params = {
	id: 1,
	name: "张三"
  }
  let data = await this.$axios.delete("你的路由地址/" + 1, { params })
  console.log(data)
  console.log("000")
},
async deletes() {
  let list = [1, 2, 3]
  let data = await this.$axios.delete("你的路由地址", { data: list })
  console.log(data)
  console.log("000")
}

 有一个没有搞出来，不是到是不支持还是自己技术不到家，如果有小伙伴知道怎么能，还请你一定要告诉我。

就是后台接口是这样子的

@GetMapping(name = "根据查询条件获取列表数据")
public Result<PageInfo> getList(@RequestBody T entity) {}

前台试了各种方法都拿不到值。目前没有搞定，等搞定了我在来补帖子。