tower1229 / vue-access-control Goto Github PK

这几天刚好在做权限控制，开发中突然请求都是500码，然后过了一晚，请求就不可用了。

get:
http://rap2api.taobao.org/app/mock/224/GET/web?name=root&password=MQ%3D%3D
Response:
{"isOk":false,"errMsg":"未匹配到任何接口 No matched interface"}

请教一个问题，那管理员分配权限那部分如何实现

The Demo page is offline

将源码整理一遍，加上详细的注释

在main.js注册has指令，在bind钩子函数里removeChild会报错，找不到父节点，换成inserted就好了
TypeError: Cannot read property 'removeChild' of null

ps：我没有直接使用你的权限控制，而 只是模仿你的注册自定义指令代码，就遇到了这个问题，不知道有何解？

code：

// main.js
Vue.directive('has', {
  inserted: function (el, binding) {
    if (!Vue.prototype.$_has(binding.value)) {
      el.parentNode.removeChild(el)
    }
  }
})

// Layout.vue(app.vue routerview的节点)
created () {
  this.$store.dispatch('getUserInfo')
}

// store.js 
getUserInfo () {
.....
 service.get('/userinfo').then(user => {
     commit('setUserInfo', user)
     Vue.prototype.$_has = function (rArray) {
        let requiredPermission = []
        let permission = true
        if (Array.isArray(rArray)) {
           rArray.forEach(role => {
               requiredPermission = requiredPermission.concat(role)
           })
        } else {
             requiredPermission.push(rArray)
        }
        if (!requiredPermission.includes(role)) {
           permission = false
        }
          return permission
     }
})
....

}

哈喽~还在维护吗？怎么登录不进去了呢

您好
在App.vue模块的extendRoute方法
如果未刷新岂不是重复addRoutes了吗

I cloned the repo ,then npm run lint,show many errors:

.......
xxxxxxxxxxxxx
......
error: Parsing error: Cannot find module 'babel-eslint' at src\views\roles.vue:
1 | <style scoped>
2 |
3 | .extendGroup {
4 | float: right;
5 | margin-right: 20px;
6 | opacity: 0;
7 | }
8 |
9 | .el-tree-node__content:hover .extendGroup {
10 | opacity: 1;
11 | }
12 | </style>
13 |
14 |
15 |

error: Parsing error: Cannot find module 'babel-eslint' at babel.config.js:
1 | module.exports = {
2 | presets: [
3 | '@vue/app'
4 | ]
5 | }
6 |

error: Parsing error: Cannot find module 'babel-eslint' at vue.config.js:
1 | module.exports = {
2 | outputDir: 'docs',
3 | baseUrl: process.env.NODE_ENV === 'production'
4 | ? '/Vue-Access-Control/'
5 | : '/'
6 | }

22 errors found.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] lint: vue-cli-service lint
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] lint script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\changhong\AppData\Roaming\npm-cache_logs\2018-12-04T07_54_27_514Z-debug.log

how to fix it?

你好。
v-has在原生HTML标签中使用时，如果判断条件满足，会因为el查找不到父节点而报错。不知是否设计如此，只允许在自定义组件中使用。

<!--报错代码-->
<div class="operation" v-has="[goods.remove]"></div> 

[Vue warn]: Error in directive has bind hook: "TypeError: Cannot read property 'removeChild' of null"

TypeError: Cannot read property 'removeChild' of null

是否可以通过在bind方法中设置元素隐藏，然后在inserted方法中移除元素的方式实现。

WAIT Compiling... 11:04:23 AM
94% asset optimization

ERROR Failed to compile with 4 errors 11:04:25 AM
error in ./src/App.vue

Syntax Error: Unexpected token {

@ ./src/main.js 5:0-28
@ multi (webpack)-dev-server/client?http://localhost:8088 webpack/hot/dev-server ./src/main.js

error in ./src/views/login.vue

Syntax Error: Unexpected token {

@ ./src/router/index.js 9:11-51
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8088 webpack/hot/dev-server ./src/main.js

error in ./src/views/common/401.vue

Syntax Error: Unexpected token {

@ ./src/router/index.js 15:11-56
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8088 webpack/hot/dev-server ./src/main.js

error in ./src/views/common/404.vue

Syntax Error: Unexpected token {

@ ./src/router/index.js 21:11-56
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8088 webpack/hot/dev-server ./src/main.js

如果后续要添加权限角色的话 后者需要前端路由一个一个的不断添加。