正在用 React ,也就顺手翻译了篇 React 相关的文章,文章主干
九个你忽略的 React 无状态组件的优势
译文: http://www.zcfy.cc/article/1980
翻译不到之处,也可以评论里提出来。。
1
chemzqm 2016-12-13 21:36:44 +08:00
我发现我常干的一件事就是把无状态组件转成有状态的,因为我用的 mobx 只能监听 render 里面的状态变化,这样做可以免去通过 props 传递状态的麻烦。减少组件的层级同时可以避免项目的过于碎片化,便于后续的调整。
当然, 无状态组件肯定是更加有利于测试和重用,以及性能优化的,但对于一个发展期的项目而言,我更看重的是灵活性。 我希望开发者多已自己实际情况进行思考权衡,而不是盲目相信所谓权威。 |
2
zhangolve OP @chemzqm 你说的有道理,我没有在项目中用过 mobx ,但不要迷信权威这一点我还是认同的。我也是最近才了解到无状态组件,用 eslint-airbnb-config 在没有状态的组件中 lint 有提示要使用无状态组件的写法,也就逼着自己尽量按照一些规范来。
|
3
Lpl 2016-12-13 22:43:43 +08:00 via Android
对于无状态的组件一般都是直接 export 出去, export default xxxx ,只用作渲染,父 container 传递数据和事件绑定到无状态组件。
然后无状态组件再绑定数据和事件。这样子就能重用 |
5
rockswang 2016-12-14 08:59:51 +08:00
antd 官方基于 dva 的例程里面,所有组件都是无状态的,但是很多场景并不方便,比如一个倒计时的按钮,也得在全局 state 里面放倒计时计数
|
6
zhangolve OP @rockswang 我也正在用 antd ,只是没有用 dva , antd 官方的例程上并没有见到无状态组件,倒是看的还在用 React.createClass({}) 这种方式 。 https://ant.design/components/form-cn/
dva 倒是有些了解,按我的理解是对 react+redux 进行了封装,形成了自己的一套框架。还是想要把状态和表现分离开,所以用无状态组件也不奇怪了。能不能给个你说的例程链接,我瞅瞅。 |
7
reus 2016-12-14 22:55:56 +08:00
同意,很好的做法
|