dom-has

通过注入key来实现对每个HTML DOM元素的权限管理 ##安装

npm i dom-has

引入方法

在入口文件中,例如 main.js 引入

import DOMPermission from 'dom-has'
Vue.use(DOMPermission)

##使用方法 在需要做权限管理的HTML DOM元素上添加指令v-dom-has，并且给元素添加一个key，key作为值传入指令中

<div v-dom-has="'key'">
    ...
</div>

//同理可以使用在其他HTML元素上

需要注意的是，为了更灵活的管理每一个dom，最好是每个key都具有唯一性，key将被用来跟从后端获取的权限列表进行匹配

##注入权限列表

sessionStorage.setItem('domAccessKeys', JSON.stringify(list)))

//需要把从后端拿到的权限列表存到sessionstorage中
//存储的key为domAccessKeys
//权限列表的格式应该是['key1','key2','key3',...]

##细化权限列表 如果把所有的权限key都放入一个Array中，那样需要命名的key数量太多，可以把key分组，例如：以router name来分组

{
routerName1:[],
routerName2:[],
...
}

这样在使用的时候就需要把分类传入指令

<div v-dom-has="{classify:routerName1,key:'key1'}">
    ...
</div>

//同理可以使用在其他HTML元素上