一、main.js
import Vue from "vue";
import "./plugins/axios";
import App from "./App.vue";
import router from "./router";
import store from "./store";
// step1：引入 axios
import Axios from 'axios'
Vue.config.productionTip = false;
// step2：把axios挂载到vue的原型中，在vue中每个组件都可以使用axios发送请求,(我的设置不成功)
// 不需要每次都 import一下 axios了，直接使用 $axios 即可
// Vue.prototype.$axios = Axios
// step3：使每次请求都会带一个 /api 前缀
Axios.defaults.baseURL = '/api'
new Vue({
router,
store,
render: h => h(App)
}).$mount("#app");
二、vue.config.js
module.exports = {
lintOnSave: false,
devServer: {
proxy: {
'/api': {
// 此处的写法，目的是为了 将 /api 替换成 https://www.baidu.com/
target: 'http://localhost:8999/json/getdiff',
// 允许跨域
changeOrigin: true,
ws: true,
pathRewrite: {
'^/api': ''
}
}
}
}
};
三、对应view中
methods: {
getgrouplist() {
let oldJSON;
let newJSON;
axios.get('/',{
params: {
oldUrl: ‘123',
newUrl: '456'
}
}).then(function (resp){
oldJSON = JSON.stringify(resp.data.data.old);
// alert(oldJSON);
newJSON = JSON.stringify(resp.data.data.new);
})
this.oldStr = JSON.stringify(oldJSON, null, 4);
this.newStr = JSON.stringify(newJSON, null, 4);
},