采用了vue-element-admin里面的登录权限判断,基本都按里面引入和加载了,但是还是会提示报错
main.js
import Vue from 'vue'
import App from './App'
import router from './router'
import store from './store'
Vue.config.productionTip = false
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
store,
components: { App },
template: '<App/>'
})
login.vue
export default {
data () {
return {
userName: '',
passWord: ''
}
},
methods: {
verify () {
if (this.userName === '') {
mui.toast('用户名不能为空!', { duration: 'long', type: 'div' })
return false
}
if (this.passWord === '') {
mui.toast('密码不能为空!', { duration: 'long', type: 'div' })
return false
}
return true
},
login () {
let result = this.verify()
if (result) {
let data = {
username: this.userName,
password: this.passWord
}
this.$store.dispatch('LoginByUsername', data).then(() => {
this.$router.push({ path: '/' })
// mui.toast('登陆成功', { duration: 'long', type: 'div' })
}).catch(() => {
// mui.toast(res.msg, { duration: 'long', type: 'div' })
})
} else {
console.log('error submit!!')
return false
}
}
}
}
login.js
import request from '@/utils/request'
export function loginByUsername (username, password) {
const data = {
username,
password
}
return request({
url: '/User/login',
method: 'post',
data
})
}
user.js
import { loginByUsername, logout, getUserInfo } from '@/api/login'
import { getToken, setToken, removeToken } from '@/utils/index'
actions: {
// 用户名登录
LoginByUsername ({ commit }, userInfo) {
const username = userInfo.username.trim()
return new Promise((resolve, reject) => {
loginByUsername(username, userInfo.password).then(response => {
const data = response.data
console.log(data)
commit('SET_TOKEN', data.token)
setToken(response.data.token)
resolve()
}).catch(error => {
reject(error)
})
})
}
}
request.js
import axios from 'axios'
import mui from 'mui'
import store from '@/store'
import { getToken } from '@/utils/index'
// request interceptor
service.interceptors.request.use(config => {
// Do something before request is sent
if (store.getters.token) {
// 让每个请求携带token-- ['X-Token']为自定义key 请根据实际情况自行修改
config.headers['XX-Token'] = getToken()
}
console.log('token +'.store.getters.token)
return config
}, error => {
// Do something with request error
console.log(error) // for debug
Promise.reject(error)
})
然后请求的时候,老是报错Cannot read property 'getters' of undefined
request.js打印那句那里明显写错了啊,store前面多了个.