目录

新建按钮

 后端定义新接口 

 新建一个前端Api请求

前端样式代码按钮

为按钮绑定一个事件 

超级管理员

普通管理员 

权限定义

 显示

 后端返回数据 

---

新建按钮

 后端定义新接口 

找到后端controller代码，通过注解里的函数@ss.hasPermi('system:user:list') 返回值控制。

返回true，表示具有授权[Authorize ]，能够继续访问；返回false，表示不具有授权，不能继续访问

@PreAuthorize("@ss.hasPermi('system:studentdata:permTest')")
    @GetMapping("/permTest")
    public AjaxResult permTest(Studentdata studentdata)
    {
        return AjaxResult.success("权限测试成功");
    }

 新建一个前端Api请求

// 权限验证功能
export function permT() {
  return request({
    url: '/system/studentdata/permTest',
    method: 'get'
  })
}

前端样式代码按钮

<el-col :span="1.5">
              <el-button
                type="text"
                plain
                icon="el-icon-download"
                size="mini"
                @click="handlepermTest"
                v-hasPermi="['system:studentdata:permTest']"
              >权限测试</el-button>
            </el-col>

为按钮绑定一个事件 

 /** 权限测试操作 */
        handlepermTest() {
        alert("权限测试成功");
        },

超级管理员

普通管理员 

权限定义

 显示

 后端返回数据 

 

@PreAuthorize("@ss.hasPermi('system:studentdata:permTest')")
    @GetMapping("/permTest")
    public AjaxResult permTest(Studentdata studentdata)
    {
        return AjaxResult.success("权限测试成功",10);
    }