vuecli3使用axios发送请求到后端获取token详解

1.安装axios

 $ npm install axios
 $ npm install vue-axios

2.在mian.js中添加如下代码

import axios from 'axios'
import VueAxios from 'vue-axios'
import Qs from 'qs'
Vue.use(VueAxios,axios,Qs)

3.在创建好的vuecli3项目的根目录添加vue.config.js文件

module.exports = {
  devServer: {
    disableHostCheck: false,
  },
  assetsDir: 'static/',
  productionSourceMap:false,
  css: {
    loaderOptions: { // 向 CSS 相关的 loader 传递选项
      less: {
        javascriptEnabled: true
      }
    }
  }
}

4.回到main,js添加代码

axios.defaults.baseURL="http://###.###.#.##:8086";//需要请求的后端域名 

5.在需要登录页面添加script

data() {
        return {
            email:"[email protected]",
            password:"11111111111111111",
            token:""
        }
    },
    created() {
        
    },
    methods: {
        login(){
            let email=this.email;
            let password=this.password;
            this.axios
            .post("/user/login", {
                email:email,
                password:password
            })
            .then(res => {
                this.token=JSON.parse(res.data.data);
                this.$store.commit("LOGIN", JSON.parse(res.data.data));
                
            });
            if(this.token){
                    console.log("success");
                } 
        }
    },

如果能够成功输出success,表示成功
有错误的话欢迎指正

你可能感兴趣的:(axios,vuecli3,token)