11.Vue安装Axios及使用

11.Vue安装Axios及使用

1.安装：npm install axios --save-dev

2.main.js中导入
　　import axios from 'axios'; /* 引入axios进行地址访问*/
　　Vue.prototype.$http = axios;
　　（注意：不使用use来使用该例，而是用prototype原型来使用）

3.login.vue中：
　　import axios from 'axios';

　　axios.post("/api/login?", params).then(function(res) {
　　　　var data = res.data;
　　　　// console.log(data);
　　　　let role = data.result.user.role;
　　　　let token = data.result.token;
　　　　localStorage.setItem("currentUser_token", token); //将token存到本地的localStorage中
　　　　// console.log(localStorage);
　　　　if (data.code == 1) {
　　　　alert(data.msg);
　　　　let _username;
　　　　// console.log(localStorage.getItem("currentUser_token"))
　　　　// console.log(userName)
　　　　that.$router.push({path: "/index",query: { name: userName, role: role }}); //跳转到 index页面中并传递name和role的值

　　　　(在index页面中接受参数：PS：let userName = this.$route.query.name;let userRole = this.$route.query.role;)

　　} else {

　　　　alert(data.msg);
　　}
　　}).catch(function(err) {
　　　　console.log("LOGIN_" + err);
　　});
（注意：若要使用全局路径访问请求则需要在config中的index.js中配置proxyTable）
举例：proxyTable: {
　　　　'/api': {
　　　　　　target: 'IP+端口', //后端接口地址
　　　　　　changeOrigin: true, //是否允许跨越
　　　　　　pathRewrite: {
　　　　　　'^/api': '/api', //重写,
　　　　　　}
　　　　　}
　　　},