Vue_mixin混入_全局检查权限

目的:

通过一个全局方法检测是否有某个权限,有就放行,没有就false

mixin(混入)来让所有的组件可以拥有一个公共的方法

src/mixin/checkPermission.js

import store from '@/store'
export default {
  methods: {
    checkPermission(key) {
      const { userInfo } = store.state.user
      if (userInfo.roles.points && userInfo.roles.points.length) {
        return userInfo.roles.points.some(item => item === key)
      }
      return false
    }
  }
}
​

main.js里注册为全局混入方法

import CheckPermission from '@/mixin/checkPermission' // 引入混入方法

// 注册全局混入检查方法

vue.mixin(CheckPermission)

在某个组件中检查权限点

// POINT-USER-UPDATE是权限的名称
 <el-button :disabled="!checkPermission('POINT-USER-UPDATE')" type="text" size="small" >查看</el-button>
​

此时，可以通过配置权限的方式，检查权限的可用性了