V2EX › ruoxie 的所有回复 › 第 35 页 / 共 35 页

之前写一个 demo，直接移除 dom 元素可能比 display="none"好一点
<template>
<div>
<v-btn color="primary">正常按钮</v-btn>

<v-btn color="success" v-permission:function.all="permission">权限按钮</v-btn>
<br>
<v-btn color="error" @click="updatePermission">更新按钮所需权限</v-btn>
</div>
</template>
<script>
const USER_PERMISSION=["FUNCTION_USER_ADD","FUNCTION_USER_DEL"];
const USER_ROLE=["ROLE_TEST1","ROLE_TEST2"];
export default {
data() {
return {
permission:['FUNCTION_USER_ADD','FUNCTION_USER_DEL'],
flag:true
};
},
methods:{
updatePermission(){
this.permission=this.flag?["USER_TEST3"]:['FUNCTION_USER_ADD','FUNCTION_USER_DEL'];
this.flag=!this.flag;
}
},
directives: {
permission: {
// 指令的定义
bind: function(el,binding) {
let checkCodes=[];
if(binding.arg==="function"){
checkCodes=USER_PERMISSION;
}else if(binding.arg==="role"){
checkCodes=USER_ROLE;
}else{
checkCodes=USER_PERMISSION.join(USER_ROLE);
}
let access=true;
if(binding.modifiers.all){
for(let need of binding.value){
if(!checkCodes.some(s=>s===need)){
access=false;
break;
}
}
}else{
access=false;
for(let need of binding.value){
if(checkCodes.some(s=>s===need)){
access=true;
break;
}
}
}
if(!access){
el.style.display="none";
}
console.log("bind:"+JSON.stringify(binding),access);
},
update:function(el,binding){
let checkCodes=[];
if(binding.arg==="function"){
checkCodes=USER_PERMISSION;
}else if(binding.arg==="role"){
checkCodes=USER_ROLE;
}else{
checkCodes=USER_PERMISSION.join(USER_ROLE);
}
let access=true;
if(binding.modifiers.all){
for(let need of binding.value){
if(!checkCodes.some(s=>s===need)){
access=false;
break;
}
}
}else{
access=false;
for(let need of binding.value){
if(checkCodes.some(s=>s===need)){
access=true;
break;
}
}
}
if(!access){
el.style.display="none";
}else{
el.style.display="inline-flex";
}
console.log("update:"+JSON.stringify(binding),access);
}
}
}
};
</script>

2018 年 10 月 12 日

回复了 Jaeger 创建的主题 › 程序员 › 你们的开源项目的官网都是用什么搭建的？

docsify https://wjkang.github.io/lazy-mock/#/

2018 年 9 月 4 日

回复了 mathzhaoliang 创建的主题 › 问与答 › [标准刷赞方式 ] v 友们写过什么独一无二的项目没有，在这里秀一下

一个快速生成后端模拟数据的工具
Github:https://github.com/wjkang/lazy-mock
特点：
轻松对接 mock.js ，faker.js 等假数据生成工具
不需要数据库，直接持久化数据到 JSON 文件
相比 json-server 单 JSON 文件，支持一个实体一个 JSON 文件
默认包含了 jwt 实现的登录与登出，基于 RBAC 模型的权限控制
使用 async/await 处理异步问题
MVC 代码分层结构
内置简单代码生成器

1 ... 26 27 28 29 30 31 32 33 34 35

❮

❯