当前位置:嗨网首页>书籍在线阅读

15-React中的组件_封装与复用

  
选择背景色: 黄橙 洋红 淡粉 水蓝 草绿 白色 选择字体: 宋体 黑体 微软雅黑 楷体 选择字体大小: 恢复默认

1.4.2 React中的组件:封装与复用

React组件具有良好的封装性、复用性和组合性。这些特性有助于为用户提供一种更简单、更优雅的方式来思考和构建用户界面。应用可以由清晰、简洁的分组组成,而不是像意大利面条那样一团乱。使用React来构建应用就像使用乐高积木来构建项目一样,不同的是构建应用时有取之不尽的“积木”。人们可能会遇到bug,但幸运的是不会踩到“积木”上。

在练习1-1中你实践了使用组件进行思考并将界面拆解成了组件。可以用很多方法来做这件事,并且这些方法可能没有特别的组织方式或惯例。这没关系。但是,当使用React中的组件时,考虑组件设计上的组织和一致性就非常重要了。需要设计独立的并且关注特定问题或一组相关问题的组件。

这有助于产生那种在应用中可移植的、逻辑分组的、易于移动和复用的组件。即使使用了其他库,设计良好的React组件也应该是相当独立的。将UI分解成组件可以让人更轻松地处理应用的不同部分。组件间的边界意味着功能和组织可以被良好地定义,而独立的组件则意味着它们可以更容易地被复用和移动。

React中的组件需要一起工作。这意味着可以将组件组合起来形成新的复合组件。组件组合是React最强大的部分之一。可以创建一个组件并让应用的其余部分复用它,这在大型应用中通常特别有帮助。如果身处一个大中型团队中,可以将组件发布到私有注册中心(npm或其他),其他团队可以很容易地将这些组件拉下来并将它们用到一个新的或已有的项目中。这可能不是一个适用于所有规模团队的场景,但即使是更小规模的团队也可以从React组件带来的代码复用中获益。

React组件的最后一个方面是生命周期方法。当组件经过其生命周期的不同时期时(挂载、更新、卸载等),可以使用这些可预测的、定义良好的方法。我们将在后面几章花很多时间在这些方法上。