解析为什么axios会有params和data两个参数

  不知道大家有没有过这种感觉,突然一个问题百思不得其解,然后突然有一天就明白了。然后就感觉这个问题原来这么简单,本来想记录下来,但是又感觉这么简单的问题记录下来没啥意义。但是回过头来想一想,这个问题之前其实困扰了你很长时间。感觉还是记录一下比较好,万一哪一天突然对这个问题有了新的扩展呢?

  先来回顾一下axios的基本使用,怎么发送一个请求:

  发送get请求

  // 发送的链接就是 https://www.baidu.com?a=1

  axios.get('https://www.baidu.com', { params: { a: 1 } })

  // 或者这样

  axios({

  method: "get",

  url: 'https://www.baidu.com',

  params: { a: 1 }

  })

  // 如果发送一个带请求头的就是这样

  axios.get('https://www.baidu.com', { params: { a: 1 }, headers: { token: "123" } })

  // 或者这样

  axios({

  method: "get",

  url: 'https://www.baidu.com',

  params: { a: 1 },

  headers: { token: "111" }

  })

  发送post请求

  axios.post('https://www.baidu.com', { a: 1 })

  // 或者这样

  axios({

  method: "post",

  url: 'https://www.baidu.com',

  data: { a: 1 }

  })

  // 如果发送一个带请求头的就是这样

  axios.post('https://www.baidu.com', { a: 1 }, { headers: { token: "123" } })

  // 或者这样

  axios({

  method: "post",

  url: 'https://www.baidu.com',

  data: { a: 1 },

  headers: { token: "111" }

  })

  这里我们可以发现

  可以传递两个参数 和

  可以传递三个参数 、、

  好像不方便记忆,一会传2个,一会传3个的。所以一般情况下,即使是对项目封装网络请求,我也会使用去封装,而不是使用和。

  那么使用,get请求时如果给请求传一些参数,那么可以使用,例如:

  axios({

  method: "get",

  url: 'https://www.baidu.com',

  params: { a: 1 }

  })

  而使用post的时候需要使用,例如:

  axios({

  method: "post",

  url: 'https://www.baidu.com',

  data: { a: 1 }

  })

  好奇挂啊,为什么不能使用同一个参数呢?其实和有各自的使用意义。

  是拼接在url后面的参数

  是请求体里面的参数

  例如发送post的时候

  axios({

  method: "post",

  url: 'https://www.baidu.com',

  data: { a: 1 },

  params: { a: 2 }

  })

  上面例子会放在url后面拼接,而会在请求体中。所以和其实是各司其职的。

  那么再来看一下,如果像使用,我既想在url后面拼接参数,又想在请求体里面有参数,该怎么写呢?

  axios.post('https://www.baidu.com', { a: 1 }, { params: { a: 1 }, headers: { token: "123" } })

  所以还是感觉直接调用好用

  到此这篇关于为什么axios会有params和data两个参数的文章就介绍到这了,更多相关axios params和data两个参数内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

  您可能感兴趣的文章: