React实战-一个非常棒的React与Material风格相结合的UI控件库(Material-UI)
ReactJs提供了JSX、UI更新机制、组件化原则等底层支持,但是正如我们在所有的程序语言基础上搭建系统框架所面临的问题一样,很大程度上语言提供的是解析、编译、运行过程的后台调度等,真正实现一个应用往往由大量的三方控件或库完成。所以当我们长期使用一个框架后,往往陷入了框架的规则,忘记了语言的规则,在java中最明显的例子就SSH了,在项目整体架构成熟后,我们好像就在干配置的工作,不断的依据SSH的规则,维护着库内或各层间的关联。
但是如果不用框架,几乎是不可能的,因为各种框架或者库,是之前程序员的经验总结与积累,这也就是每个人在设计程序框架时需要面临的经典问题:是选用轮子还是造轮子的问题?甚至在选轮子时,依然存在苦恼,哪个轮子好的问题。
在ReactJs开发过程中,你可以选择任何你喜欢的组件,在http://react-component.github.io/badgeboard/,你可以找到各类ReactJs的组件。
但是目前为止,我依然认为Material-UI是一款你应该首先选择的UI控件库(http://www.material-ui.com/#/components/app-bar)主要原因有以下几点:
1.完全基于ReactJs
Material-UI是一款完全基于ReactJs的控件,采用的是ReactJs的原理实现,虽然在早期的版本中存在为了推出控件,采用了原始的数据流和控制流方式,但是从其版本更新来看,它在不断改造自己,是自己更ReactJS。
2.设计风格基于Material
Material是近年来流行的设计方式,推崇简洁、明快的设计风格,在Material-UI中蕴含了前卫的设计元素,够炫、够Cool。
3.控件丰富、涵盖所有典型场景
在选择控件时,我们希望一个库能涵盖所有典型场景,但往往会出现很多的三方库集成在一起的情形。采用Material-UI不能说涵盖了所有所需控件,但至少涵盖了所有典型场景。
4.活跃度高
选择控件一个重要的考虑因素是活跃度,活跃度高的意味着该控件经历着各类实战的考验,能及时更新bug,控件库的功能、性能更有保证。从github上我们可以看到参与的开发者和使用者均居高位。
5.版本更新频率高
版本更新频率高是个双刃剑,你可能庆幸下一个版本修改了你急需修改的bug,也可能因为下一个版本的实现方法改变了导致你要重新修改代码,但目前看来,Material-ui的版本变化处理修改bug外,均是是自己更reactjs。
6.同时支持SVG/Font Icon
7.设置样式简单
Material-ui不仅支持一般采用Css class或者在JSX中设置Inline Styles设置样式,也可以采用设置Themes的方式统一设置整个应用的样式。如: