Vue中怎么使用axios发送请求

在Vue中使用axios发送HTTP请求

最新推荐文章于 2023-12-21 13:18:04 发布

原创最新推荐文章于 2023-12-21 13:18:04 发布 · 2.6k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#vue #js #ajax #axios

本文介绍了在Vue项目中如何安装和配置axios，以及如何通过vue-axios插件来发送GET请求。首先，使用npm安装axios和vue-axios。接着，在main.js文件中导入并应用它们。然后，展示了一个在组件中调用axios发送请求的例子，包括设置请求URL、方法和数据，并处理响应及错误。

Vue中怎么使用axios发送请求

1.首先安装所需要的axios包

npm install --save axios vue-axios

2.在main.js中引入axios和vue-axios

import axios from "axios";
import VueAxios from "vue-axios";
Vue.use(VueAxios, axios)

触发方法发送axios请求

sendAxiosFunction() {
      let promise = this.axios(
        {
          // headers:{'Content-Type':'multipart/form-data;charset=UTF-8'} from表单
          // headers: { 'Content-Type': 'application/json;charset=UTF-8' },请求json数据时
          url: 'http://localhost:8081/table1/test11',
          method: 'GET',//get
          data: {},
        }
      ).then((res) => {
        console.log(res)
      }).catch(error => {
        console.log(error)
      });
      console.log(promise)
    }