axios的传参方式

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

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();
      });
相关推荐
Momo__3 小时前
Vite 8.1 打包开发模式——10000 组件冷启动 15 倍,"No Bundle Dev" 七年后被自己终结
前端·vue.js·vite
HUMHSX5 小时前
Vue 组件通信核心知识点梳理
javascript·vue.js·ecmascript
妙码生花5 小时前
从 PHP 到 AI + Golang,程序员自救转型手记(二十六):icon 组件封装
前端·vue.js·typescript
李明卫杭州5 小时前
Vue2 & Vue3 中 Router `props` 配置详解:彻底摆脱 `$route` 依赖
前端·vue.js·前端框架
熊猫钓鱼>_>5 小时前
2026 前端的三场底层革命:当 Vue、React Native 和 Three.js 同时去掉中间层
前端·javascript·vue.js·react native·架构·webgl·three.js
自己记录_理解更深刻6 小时前
Computed 聚合依赖+ 竞态处理
vue.js
李明卫杭州8 小时前
Vue3 Suspense 组件详解:从入门到避坑指南
vue.js
gis开发之家11 小时前
vue3组合式函数(Composables)的艺术——将业务逻辑从UI组件中连根拔起
前端·javascript·vue.js·前端框架·vue3·前端工程化·前端架构
uuai11 小时前
vue导出pdf
前端·vue.js·pdf
Cobyte12 小时前
17.响应式系统比对:链表如何实现响应式系统的高效更新
前端·javascript·vue.js