axios的传参方式

在使用 Axios 发送 HTTP 请求时,有三种常见的传参方式:data、params 和路径参数

1、data传参

javascript 复制代码
  this.$axios({
     method: "post",
     url: "http://localhost:8080/api/user/login",
     data: {
             userId: this.userId,
             password: this.password,
          },
   })
    .then((res) => {
      console.log(res);
  })
  .catch(error => {
    console.error(error);
  });

2、使用 params 传递查询参数:

javascript 复制代码
axios.get('/api/users', {
  params: {
    page: 1,
    limit: 10
  }
})
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

params参数通常用于GET请求中添加查询参数,而对于POST请求,一般使用data参数来传递请求体数据。

3、使用路径参数传递数据:

javascript 复制代码
 deleteUser(userId) {
      this.$axios({
        method: 'post',
        url: 'http://localhost:8080/api/user/deleteUser/' + userId,
      }).then((res) => {
        //显示删除成功
        this.$message({
          message: res.data.message,
          type: "success",
        });
        //刷新表格数据
        this.userAll();
      });
相关推荐
farerboy2 小时前
WEB 项目如何禁用 F12 等功能
前端·vue.js·架构
parade岁月2 小时前
vtable-guild 被收录进 vuejs/awesome-vue 了 🎉
前端·vue.js
沙蒿同学2 小时前
一个人做完一套企业级系统,赚到了第一个 1000 块
vue.js·后端·go
mldong2 小时前
管理后台数据国际化:不建翻译表、一列 JSON、后端零改动
vue.js
Eric的技术杂货铺2 小时前
YsTable 使用:字典管理主从表页面完整实现(列配置、查询、权限按钮、主从联动、增删改查)
前端·vue.js
易朵朵2 小时前
package.json 中的 `vue-router` 详解
前端·vue.js
CopyCode2 小时前
ref、reactive、toRefs 到底该用哪个?我把三个反例都写了一遍
前端·vue.js
用户42528244567502 小时前
Vue3 复杂页面状态怎么管?别什么都往 Pinia 里塞了!
vue.js
牧艺2 小时前
cos-design 4.0:91 个特效组件一次捅成 React / Vue / Web Components / Core
前端·vue.js·web components
ikun_文2 小时前
Vue3框架项目初始化
vue.js·element·vue-router