vue3.x之全局配置axios以及使用get post请求

全局配置axios

安装

npm install axios --save

在main.js中全局配置

//引入
import axios from 'axios';
//全局挂载
const app = createApp(App);
app.config.globalProperties.$http = axios;//这里的$http就可以代替axios出现了
//配置根目录,(防止代码冗余
axios.defaults.baseURL = 'api根目录';
//注意后续使用app时要用 app.xxxxxx 而不是默认的createApp(App).xxxxxx
app.use(router).mount("#app");

使用axios

get请求

//$http === axios
this.$http
      .get("api具体要请求的地址", {
      //params 中以对象的形式给后端传参
        params: {
          这里是与后端约定好的变量名称: xxx,
        },
      })
      //回调函数
      .then((res) => {
        this.$data.xxx= res.data.data;//用本地变量接受返回的数据,这里的第二个data根据接口文档来
      });
      //this.$data.xxx注意访问本地变量时要在data前加$

post请求

大致与get类似,区别是get可以不传参