axios-一个基于Promise的http库 可用在浏览器和node.js中

引入axios 1、yarn add axios 在main.js 2、全局引入axios

import axios from 'axios'

3、加入基准地址

axios.defaults.baseURL='http://www.liulongbin.top:3006'

4、把axios挂载到vue原型上 以后vue实例（组件）都是可以直访问的

Vue.prototype.$axios=axios

示例： 一、axios查询所有图书信息

接口网址说明--ShowDochttps://www.showdoc.com.cn/ajaxapi/3753323218792173

获取图书信息

    getBook() {
      this.$axios({
        method: "GET",
        url: "/api/getbooks",
      }).then((res) => {
        console.log(res);
      });
    },

async await方法

    async getBook() {
      let res = await this.$axios({
        method: "GET",
        url: "/api/getbooks",
      });
      console.log(res);
    },

二、axios根据书名获取图书信息

    getBookname(){
      this.$axios({
        method:'get',
        url:'/api/getbooks',
        params:{
          bookname:this.bookname
        }
      }).then(res=>{
        console.log(res);
      })
    },

    
    根据书名获取图书信息

bookname: "",

async await方法

    async getBookname() {
      let res = await this.$axios({
        method: "get",
        url: "/api/getbooks",
        params: {
          bookname: this.bookname,
        },
      })
      console.log(res);
    },

三、axios添加图书信息图书信息

    addBookname(){
      this.$axios({
        method:'POST',
        url:'/api/addbook',
        data:{
          bookname:this.bookname,
          author:this.author,
          publisher:this.publisher,
        }
      }).then(res=>{
        console.log(res);
      })
    },

    
    
    
    添加图书信息

bookname: "",
author:'',
publisher:''

async await方法

    async addBookname() {
      let res = await this.$axios({
        method: "POST",
        url: "/api/addbook",
        data: {
          bookname: this.bookname,
          author: this.author,
          publisher: this.publisher,
        },
      })
      console.log(res);
    },