vue-axios|axios 在vue cli的创建例子

第一种方法:

先安装！

npm install axios

cmd 在项目所在的文件夹的路径下 再安装:

npm install --save axios vue-axios

将下面代码加入入口文件 main.js:

import Vue from 'vue'
import axios from 'axios'
import VueAxios from 'vue-axios'

Vue.use(VueAxios, axios)

↑按照这个顺序分别引入这三个文件： vue, axios and vue-axios

Usage:
This wrapper bind axios to Vue or this if you’re using single file component.

你可以按照以下，选任一方式使用:

Vue.axios.get(api).then((response) => {
  console.log(response.data)
})

this.axios.get(api).then((response) => {
  console.log(response.data)
})

this.$http.get(api).then((response) => {
  console.log(response.data)
})

例子：

    created() {
      this.axios.get("http://www.liulongbin.top:3006/api/getbooks",{params:{id:1}}).then((response) => {
        console.log(response.data)
      })
    },

第二种方法:

在main.js文件里面:

import Vue from 'vue'
import App from './App.vue'
//导入axios 并且写入Vue的原型里面,自定义名称:$http
import axios from "axios"
Vue.prototype.$http = axios

Vue.config.productionTip = false

new Vue({
	render: h => h(App)
}).$mount('#app')

使用方法:

methods: {
	async gai() {
		const {data:res}= await this.$http.get("https://www.escook.cn/api/cart")
		console.log(res)
	}
}