axios中使用data传参，还是使用params传参，哪种方式比较好？哪种传参方式使用比较多？各有什么优缺点？

在axios中，使用data传参和使用params传参都是可以的，但是它们的使用场景略有不同。

使用data传参一般用于POST请求，因为POST请求的参数需要放在请求的body中。使用data传参时，参数会被序列化成JSON格式，这种方式比较适合传递复杂的参数对象。例如：

axios.post('/api/user', {
  name: 'John',
  age: 30
})

使用params传参一般用于GET请求，因为GET请求的参数需要拼接在URL中。使用params传参时，参数会被序列化成URL查询字符串的形式，例如：

axios.get('/api/user', {
  params: {
    name: 'John',
    age: 30
  }
})

使用data传参和使用params传参各有优缺点。使用data传参可以传递复杂的参数对象，但是需要在服务端进行解析；使用params传参简单直接，但是只适合传递简单的参数。

在实际开发中，使用params传参的情况较多，因为GET请求比较常见，而且参数一般比较简单。

相关问题

axios.post params 传参

axios.post方法的params参数传参方式与get请求的传参方式是不同的。在post请求中，可以使用FormData对象来传递参数。首先在js中使用new FormData()方法创建一个FormData对象，然后通过FormData对象的append方法将参数编译成键值对的形式。示例代码如下：

let params = new FormData();
params.append("url", 'csdn.net');
params.append("code", "1234");

axios.post('/csdn/posts', params)
  .then(response => {
    console.log(response);
  })
  .catch(error => {
    console.log(error);
  });

以上代码中，通过axios.post方法向指定的URL发送post请求，并将params作为参数传递。params参数是一个FormData对象，其中使用append方法添加了"url"和"code"两个键值对。

axios中get请求传参

在axios中，可以使用三种方式进行get请求传参。第一种方式是将参数直接拼接在地址栏中进行传递。比如：axios.get('http://localhost:3000/axios?id=123')。第二种方式是将参数放在一个对象中，作为params属性的属性值进行传递。比如：axios.get('http://localhost:3000/axios', {params: {id: 789}})。第三种方式是将参数放在一个对象中进行传递。比如：axios.get('http://localhost:3000/axios/123', {params: {id: 789}})。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* [axios请求数据](https://blog.csdn.net/weixin_43709908/article/details/103435367)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *3* [axios（get、post） 请求中的@requestBody @requestParams 以及headers的使用，请求拦截器、响应拦截器的...](https://download.csdn.net/download/weixin_38569569/14015985)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]