axios

适合轻量级项目

main.js

import axios from 'axios'
Vue.prototype.$axios = axios;

post请求demo.vue   get则.get('#',{params:{xxx:xxx} })

<button  style="width:100%" @click="eg" > 例子 </el-button>


eg() {
   this.$axios.post('/api/submitConstructioner',{}).then(function(res){
          console.log()
        })
}

配置跨域

proxyTable: {
      '/api': {
        target: '################',
      },

打包跨域

prod.env.js

'use strict'
module.exports = {
  NODE_ENV: '"production"',
  API_ROOT:'"#########"'
}

2.不符合restful接口项目大

config-index.js

proxyTable: {
      '/api': {
        target: '###########',
        changeOrigin:true,
        // pathRewrite: {
        //   '^/api':''
        // }
      },
      '/tianqi': {
        target: '################',
        changeOrigin:true,
        pathRewrite: {
          '^/tianqi':''
        }
      }
    },

demo.vue

<template>
  <div>
    多接口測試
    <button @click="one">第一個</button>
    <button @click="two">第二個</button>
  </div>
</template>

<script>
import axios from 'axios'
export default {
    data() {},
    methods: {
        one() {
            axios.post('/api/submitConstructioner').then((res) =>{
                console.log(res)
            })
        },
        two() {
            axios.get('/tianqi').then((res) =>{
                console.log(res)
            })
        }
    }
}
</script>