文档章节

react 操作权限思路

賤__是一種態度
 賤__是一種態度
发布于 2017/04/28 22:57
字数 117
阅读 55
收藏 1

1. 用户登录后初始化操作权限代码,存储在store中,

2.遍历store遍历判断是否拥有该按钮操作权限

import React from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';

export function hasAuthentication(Component) {

    class WrapAuthComponent extends React.Component {

        constructor(props) {
            super(props);
        }

        render () {
            let { permissions, auth, dispatch, ...rest } = this.props;
            let isAuthenticated = false;

            for(let i= permissions.length;i--;) {
                if(auth === permissions[i]){
                     isAuthenticated = true;
                     break;
                }
            }
            if( isAuthenticated ) {
                return (<Component {...rest}/>);
            }else {
                return null;
            }
        }
    }
    
    const mapStateToProps = (state) => ({
        permissions: state.system.menu.permissions || [],
    });

    WrapAuthComponent.propTypes = {
        auth:PropTypes.string.isRequired,
        permissions: PropTypes.array,
    }

    WrapAuthComponent.defaultProps = {
        auth:'',
        permissions: [],
    }

    return connect(mapStateToProps)(WrapAuthComponent);

}

 

© 著作权归作者所有

共有 人打赏支持
上一篇: Integer 内部缓存
下一篇: spring cloud描述
賤__是一種態度
粉丝 5
博文 26
码字总数 1978
作品 0
昌平
程序员
私信 提问
React体系前端权限控制方案

在做商家后台管理系统时,作为前端通常会设计到大量的权限控制问题,按照细粒度归归类大致可以分类以下三类 页面权限 模块权限-页面区块(组件)是否显示 元件权限-组件内元素是否显示 以往的...

amibug
07/11
0
0
管理系统的登录控制?手写一个发布订阅模型!

最近做了一个后台的项目,既然是后台管理系统,登录的控制自然是少不了的。 接到需求——后台系统!花了几乎半天搞出来了Webpack配置、搞出来了React Router、搞出来了 React 代码基本的结构...

基恩士
10/19
0
0
颠覆式前端UI开发框架:React

基于HTML的前端界面开发正变得越来越复杂,其本质问题基本都可以归结于如何将来自于服务器端或者用户输入的动态数据高效的反映到复杂的用户界面上。而来自Facebook的React框架正是完全面向此...

雪舞__
2016/12/08
19
0
颠覆式前端UI开发框架:React

基于HTML的前端界面开发正变得越来越复杂,其本质问题基本都可以归结于如何将来自于服务器端或者用户输入的动态数据高效的反映到复杂的用户界面上。而来自Facebook的React框架正是完全面向此...

SomaLihq
06/27
0
0
iOS 开发是否要采用 React Native?

前言 React Native 是 Facebook 2015年开源的 Javascript 框架,旨在使用 Javascript 高效开发手机端 App。配合着多个显而易见的优势和 Facebook 强大的宣传机器,它立刻成为国内外大小公司的...

故胤道长
2017/11/20
0
0

没有更多内容

加载失败,请刷新页面

加载更多

微服务分布式事务实现

https://www.processon.com/view/link/5b2144d7e4b001a14d3d2d30

WALK_MAN
57分钟前
2
0
《大漠烟尘》读书笔记及读后感文章3700字

《大漠烟尘》读书笔记及读后感文章3700字: 在这个浮躁的社会里,你有多久没有好好读完一本书了? 我们总觉得自己和别人不一样,所以当看到别人身上的问题时,很少有“反求诸己”,反思自己。...

原创小博客
今天
3
0
大数据教程(9.5)用MR实现sql中的jion逻辑

上一篇博客讲解了使用jar -jar的方式来运行提交MR程序,以及通过修改YarnRunner的源码来实现MR的windows开发环境提交到集群的方式。本篇博主将分享sql中常见的join操作。 一、需求 订单数据表...

em_aaron
今天
3
0
十万个为什么之什么是resultful规范

起源 越来越多的人开始意识到,网站即软件,而且是一种新型的软件。这种"互联网软件"采用客户端/服务器模式,建立在分布式体系上,通过互联网通信,具有高延时(high latency)、高并发等特点...

尾生
今天
3
0
Terraform配置文件(Terraform configuration)

Terraform配置文件 翻译自Terraform Configuration Terraform用文本文件来描述设备、设置变量。这些文件被称为Terraform配置文件,以.tf结尾。这一部分将讲述Terraform配置文件的加载与格式。...

buddie
今天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部