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();
      });
相关推荐
涵涵(互关)27 分钟前
GoView各项目文件中的相关语法2
前端·javascript·vue.js
焰火19991 小时前
[Vue]可重置的响应式状态reactive
前端·vue.js
源码宝1 小时前
基于 SpringBoot + Vue 的医院随访系统:技术架构与功能实现
java·vue.js·spring boot·架构·源码·随访系统·随访管理
老王以为2 小时前
为什么 React 和 Vue 不一样?
前端·vue.js·react.js
web打印社区2 小时前
2026最新Web静默打印解决方案,无插件无预览,完美替代Lodop
前端·javascript·vue.js·electron·pdf
Forever7_3 小时前
Vue 全局监控用户行为,最强方案!
vue.js
薯老板5 小时前
vue组件之间的通信
前端·vue.js
光影少年6 小时前
前端SSR和ssg区别
前端·vue.js·人工智能·学习·react.js
吴声子夜歌8 小时前
Vue3——UI组件库Element Plus(一)
vue.js·ui·elementplus
涵涵(互关)8 小时前
语法大全-only-writer-two
前端·vue.js·typescript