VUE+IVIEW相关问题(二)：各种请求传参数处理

请求分类：

• POST
• GET
• PUT
• DELETE
• OPTIONS

首先我作为一个后台的开发人员我说下我习惯的接参处理，首先说下接参方式

1. @RequestBody 读取body中的json数据
2. @RequestParam 读取请求URL中的参数
3. @PathVisiable 路由参数，为了满足RestFul风格
4. 什么都不加，一般是根据请求进行区分：POST请求是form表单，get还是RequestParam的方式，当然这个不是绝对的，你非得用POST接收URL中的参数也是可以的

现在来说下前端传参的方式吧：

POST请求

注意我说的是约定，不是强制规则。

export const saveUser = (data) => {
  return axios.request({
    url: 'user/user/save',
    data,
    method: 'post'
  })
}

@RequestBody

以下是路由的时候处理

// 请求拦截
instance.interceptors.request.use(config => {
  config.headers.post['Content-Type'] = 'application/json;charset=UTF-8'; 
  config.data = JSON.stringify(config.data);
  return config
}, error => {
  return Promise.reject(error)
})

FORM表单形式

import qs from 'qs';
// 请求拦截
instance.interceptors.request.use(config => {
  config.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';
  config.data = qs.stringify(config.data);
  return config
}, error => {
  return Promise.reject(error)
})

文件上传

// 请求拦截
instance.interceptors.request.use(config => {
  config.headers.post['Content-Type'] = 'multipart/form-data';
  return config
}, error => {
  return Promise.reject(error)
})

以上就是针对POST请求的处理

GET请求

get请求一般都是拼接请求

export const userList = (params) =>{
  return axios.request({
    url: 'user/user/list',
    params,
    method: 'get'
  })
}

不需要进行任何特殊处理即可

PUT请求和DELETE请求

基本上会使用@PathVisiable