bird前端项目,基于react、antd、antd-admin,封装常用数据组件,细粒度权限解决方案。

bird-front是基于react的后台管理系统前端项目,框架构建部分严重借鉴于antd管理系统解决方案antd-admin,其项目地址:https://github.com/zuiidea/antd-admin

bird-front地址:https://github.com/liuxx001/bird-front

权限方案:

bird-front对权限部分进行了重新设计,支持更细粒度的权限控制(按钮级)。前端的权限应该控制什么?资源的可见性。其包括:

  • 路由的可见性。
  • 页面中按钮的可见性。

在登录时获取用户拥有的权限集合,在前端存储。

  • 路由可见性控制:路由变化时,进行权限判断,通过则渲染对应组件,否则渲染403组件。
  • 按钮的可见性控制:封装bird-button组件,传入按钮所需权限名,内部进行权限判断,通过则渲染按钮。

前端的权限控制只能处理页面渲染,不能保证系统的绝对安全,服务端也需要对接口的权限进行验证。

组件:

bird-front对常用的数据组件进行了封装,使其简单易用,包括:

所有业务组件的理念均是结合服务端接口进行组件的封装,兼顾灵活性的同时保证更优的业务开发速度。

项目获取:

git clone https://github.com/liuxx001/bird-front

安装依赖包:

npm install

启动项目:

npm run start

登录名:admin 登录密码:admin

效果图: 

【bird-front】前端框架介绍的更多相关文章

  1. 可能是目前最完整的前端框架 Vue.js 全面介绍

    Vue.js 是一个JavaScriptMVVM库,是一套构建用户界面的渐进式框架. 摘要 2016年最火的前端框架当属Vue.js了,很多使用过vue的程序员这样评价它,“vue.js兼具angul ...

  2. Vue.js教程 1.前端框架学习介绍

    Vue.js教程 1.前端框架学习介绍 什么是Vue.js 为什么要学习流行框架 什么是Vue.js Vue.js 是目前最火的一个前端框架,React是最流行的一个前端框架(React除了开发网站, ...

  3. SpringMVC 框架介绍以及环境搭建

    目录 前端设计模式介绍 分析前端设计模式 Spring MVC简单介绍 Spring和Spring MVC的关系 配置Spring MVC的环境并简单测试 前端设计模式介绍 前端设计模式其实和前端没啥 ...

  4. 10大H5前端框架

    作为一名做为在前端死缠烂打6年并且懒到不行的攻城士,这几年我还是阅过很多同门从知名到很知名的各种前端框架,本来想拿15-20个框架来分享一下,但在跟几个前辈讨教写文章的技巧时果断被无情的打击了,所以这 ...

  5. 2016国内最值得期待的响应式前端框架pintuer(拼图)--http://www.pintuer.com

    近期,需要将项目从pc端的应用扩展到移动端. 当然移动框架的第一选择必然是bootstrap,但是bootstrap作为移动端明显过于死板,而且作为国外的产品,对于国内的应用明显水土不服.框架里总有那 ...

  6. 如何选择前端框架:ANGULAR VS EMBER VS REACT

    最近一段时间是令前端工程师们非常兴奋的时期,因为三大Web框架陆续发布新版本,让我们见识到了更强大的Web框架.Ember2.0在2个月之前已经发布,从1.0升级到2.0非常简单.几周之前React发 ...

  7. 前端框架——BootStrap学习

    BootStrap简单总结下:1.栅格系统,能够很好的同时适应手机端和PC端(及传说中的响应式布局) 2.兼容性好 接下来是对BootStrap学习的一些基础案例总结和回顾: 首先引入:bootstr ...

  8. JavaScript前端框架的思考

    (此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 题记:现在JavaScript前端框架层出不穷,尤其Angular进入到2.x时候之后,我们 ...

  9. Semantic-UI和其他几个前端框架

    本来是想介绍Semantic-UI的,但如果只介绍这个框架,没什么内容,框架相关feature站点上有不需要说,所以干脆列出自己常用的几个前端框架,算是做个阶段性总结. 本文的核心是侧重于HTML/C ...

随机推荐

  1. SpringMVC---Method

    GET 平时网页的一些基本的URL都是GET请求的,用于执行查询操作. 但是由于GET中URL是有长度的限制的,而GET会把所有的参数都放在URL中 因此就会有下面的问题: 1 数据都明文暴露,用户可 ...

  2. Android WebView 上传各种文件(包括拍照 录像 录音 文件 音乐 等,用到图片或拍照的,可以参考下)

    我也是从网上扒下来的,经过多次实验,找到了个好用的.网上能搜到最多的也就是这个解决方案,我英文不好,也没仔细研究,但大多数都是出自这: http://stackoverflow.com/questio ...

  3. 在使用hibernate的getHibernateTemplate()时怎么让控制台输出封装好的SQL? 怎么用日志打印出来?

    我们在使用 Hibernate 时一般只会关注是否显示生成的 SQL 语句,不过有些时候还不够.默认时 Hibernate 执行的 SQL 语句是打印在控制台上的,它也可以配置为输出给 Log4J 或 ...

  4. 在动态链接库dll中弹出对话框

    在动态链接库dll中弹出对话框步骤: 1.添加Dialog资源,然后在资源视图的对话框界面右击添加类,输入类名MyDlg,使得其继承与CDialogEx.(继承CDialog应该也可以)2.在新生成的 ...

  5. JavaScript的简单继承实现案例

    <html><body><script> //实现JavaScript继承的步骤: //1:写父类 //2:写子类 //3:用Object.create()来实现继 ...

  6. A:分段函数-poj

    A:分段函数 总时间限制:  1000ms 内存限制:  65536kB 描述 编写程序,计算下列分段函数y=f(x)的值. y=-x+2.5; 0 <= x < 5 y=2-1.5(x- ...

  7. django事务处理

    #导包 from django.db import transaction try: #django默认是自动提交到数据库,此处设置不让其自动提交 transaction.set_autocommit ...

  8. dingo/API 最新版 V2.0 之安装讲解

    我发现关于dingo/API V2.0的资料少之又少,应该也是发布时间不久的原因.下面,我就来给大家讲解(翻译)下官方的英文文档,如果有说的不对的地方,请指正.先附上,官网wiki地址https:// ...

  9. 初识java这个小姑娘(一)

    忽然想起这样一个场景:那时我还是小学三年级的一个小学生,上课的铃声响起,文艺委员起头,大家开始胡乱的开始唱歌,"让我们荡起双桨,小船儿推开波浪",歌声在一片稚气中慢慢停止.我们的语 ...

  10. 【luogu P1186】玛丽卡

    https://www.luogu.org/problem/show?pid=1186 考虑暴力,枚举图上每一条边删去后跑Dijkstra,取M次的最大值. 仔细想想就会发现删除最短路以外的边对最短路 ...