vuejs中vue-resource或使用axios发送请求及解决跨域问题

1.安装axios，3种
①.npm安装
npm install axios
②.使用淘宝源
cnpm install axios
③.或者使用cdn：

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

2.在main.js文件里添加以下2行代码

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

3.完成以上操作即可在methods使用以下2中发送请求：
①.直接使用

varurl="/abc/a/b/c"
this.$http.post(url,{table:this.param1.table},{emulateJSON:true})
   .then(function (res) {
      console.log(res);
      alert("添加成功");
       location.reload();
 });
methods:{
resdata:function(){
varurl="/abc/a/b/c"
this.$http.get(url)
  .then(function (res) {
    console.log(res);
  });
}
}

②.如果使用以下代码发送请求：

methods:{
resdata:function(){
var url='a/b/c';
axios.post(url)
.then( res=>{
  console.log(res)
  })
}
}

则要在使用此代码的组件中引入axios，代码如下：
import axios from ‘axios’;
4.解决跨域问题：
①在 config>index.js 的 dev 中添加配置项 proxyTable：
dev: {
env: require(‘./dev.env’),
port: 8088,
autoOpenBrowser: true,
assetsSubDirectory: ‘static’,
assetsPublicPath: ‘/’,
proxyTable: {
‘/abc’: {
//需跨域请求的地址
target: ‘http://localhost:8089/abc‘,
changeOrigin: true,
pathRewrite: {
‘^/abc’: ”
}
}
},
②.安装vue-resource
npm install vue-resource
③main.js添加如下2行代码：
import VueResource from ‘vue-resource’;
Vue.use(VueResource)
④完成以上即可使用：
//注意此段路径开头要和代理路径末尾的/abc相同
this.$http.post(“/abc/a/b/c”,{uName:“hyf”,uPwd:”123”},{emulateJSON: true})
.then(
(response)=>{
console.log(response);
},
(error)=>{
console.log(error);
}
);