忽然想起的 material-ui

时隔两年(竟然这么久了……)重新认真看 React 和使用 material-ui ,我感到除了随着 react 版本迭代而带来的内部计算和渲染机制,material-ui 有些两年前(0.13.3 版本)我认为是缺点的东西……在现在的 0.19.x 依然被我认为是缺点。

比如,对组件内使用 inline-style 谜一样的坚持却不给予足够的状态机描述,或者在关键的地方留下扩展口(比如我要定制 Tabs 的 Tab item 的宽度、高亮状态就比较麻烦,写得很 hack)。

又比如,material-ui 不提供在组件的关键位置,比如某个节点的 before、after ,接入的机制。

再比如,关联组件绑定得太死,子组件的可替换性太差(还是 Tabs 的例子,由于第二点说的缺乏关键位置接入机制,有时候就不得不考虑通过特殊的 children item 来 hack 想达到的效果,但 Tabs 内部的 children 必须是名为 Tab 的组件数组,而且这一点你只有看源代码才知道,并且在文档里它并不会告诉你只要实现 Tab 的相关接口就可以让 Tabs 接纳这个 Tab 组件。这个缺点很主观,我是这么看的:由于 React 极早就引入了 context 机制(vue 在 2.2 以后的版本才有对应的特性),这种关联的父子组件应该早就有较好的社区 best practice 了才对,Tabs 不应该被做成这种字面意义耦合实际上不耦合的形式。

material-ui v1-beta 在开发中了,全面引入了 typescript 做 interface restraint,每个组件我还没细看。

material-ui 是我入职后第一份工作使用的第一个组件库,也是我入门 React 的第一个组件库。必须要感谢孙老师和文哥 😁 一位负责挖坑带我跳,另一位负责把坑挖得更深然后带我一起填。孙老师把 scaffold 搭好的时候我是懵逼的,JSX 看得我眼花缭乱;后来我就模仿文哥改写 material-ui 现有的组件,然后把写得不好的地方推锅出去 🌝

记得使用 material-ui 0.13.3 开发后台的时候,有一些地方当初 hack 得很痛苦。这次重新使用 0.19.x 来写东西,我觉得顺畅多了,因为很多 API 恰好是从 0.13.4 开始被认真考虑和设计过了。另外,一些当时我抓耳挠腮也想不到比较优雅的方式解决的场景,现在会能快一些找到思路去做,因为我进步了 😊