怎么对前端的一些按钮做一个权限校验

在一般情况下,我们需要对一些按钮做一个权限校验,来保证只有有权限的用户才能看到

1.创建一个js文件,来写我们的全局方法

我的方法是这样的

import Vue from 'vue';Vue.mixin({methods:{hasAuth(perm) {var authority = this.$store.state.menu.permList;if (authority.indexOf(perm) > -1) {return true;} else {// this.$message.error('没有权限');return false;}},}});

2.在main.js中引入

import global from "./globalFun";

3.就可以在你想要使用方法的按钮上使用了

    <el-form-item><el-button type="primary" @click="dialogVisible=true" v-if="hasAuth('sys:user:save')">新增</el-button></el-form-item>

这样当用户没有这个权限的时候,这个按钮不会进行显示