Vue: axios 请求封装及设置默认域名前缀 (for Vue 2.0)

this.apiGet(‘/users‘, {})
  .then((res) => {
    console.log(res)
  }, (err) => {
    console.log(err)
  })

cnpm install axios --save

const webpack = require(‘webpack‘)

// define the different HOST between development and production environment
var DEV_HOST = JSON.stringify(‘http://192.168.32.12：8080‘)
var PUB_HOST = JSON.stringify(‘http://{部署服务器ip和端口}‘)

plugins: [
  new webpack.DefinePlugin({
    HOST: process.env.NODE_ENV === ‘production‘ ? PUB_HOST : DEV_HOST
  })

import axios from ‘axios‘
axios.defaults.baseURL = HOST
window.axios = axios
window.HOST = HOST
 
const bus = new Vue()
window.bus = bus

const apiMethods = {
    methods: {
        apiGet(url, data) {
            return new Promise((resolve, reject) => {
                axios.get(url, data).then((response) => {
                    resolve(response.data)
                }, (response) => {
                    reject(response)
                    console.log(response)
                    bus.$message({
                        message: ‘请求超时，请检查网络‘,
                        type: ‘warning‘
                    })
                })
            })
        },
        apiPost(url, data) {
            return new Promise((resolve, reject) => {
                axios.post(url, data, {
                    headers: {
                        ‘Content-Type‘: ‘application/json‘
                    }
                }).then((response) => {
                    resolve(response.data)
                }).catch((response) => {
                    console.log(‘f‘, response)
                    resolve(response)
                    bus.$message({
                        message: ‘请求超时，请检查网络‘,
                        type: ‘warning‘
                    })
                })
            })
        }
    }
}

export default apiMethods

import http from ‘../../../../static/js/http.js‘

mixins: [http]

this.apiGet(‘/index.php/api/v1/goods/list‘, {
                    params: {
                        property_name: ‘秒杀‘
                    }
                })
                .then((res) => {
                    if(res.code == 0){
                        this.hotListDate = res.result;
                    }else{
                        this.$message.error(res.message);
                    }
                }, (err) => {
                    console.log(err)
                });

this.apiPost(‘/index.php/api/v1/user/login‘, {
                    mobile      : this.form.phone,
                    password    : this.form.password
                })
                .then((res) => {
                    if(res.code == 0){
                       
                    }else{
                        this.$message.error(res.message);
                    }
                }, (err) => {
                    console.log(err)
                });