🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
**组件化本质** * 组件化的本质,其实就是面向对象的设计思想。组件化可以对应于 一个类,每个类都对外输出不变的接⼝,只要接⼝不变,类与类间 的通讯可以根据接⼝进行,由此不同组件间的耦合度就降低了。 同时复杂的类可以通过若干个简单的类组合而成,这样一来,不但 可以提高组件的重用性,同时通过组合的思想来设计复杂的控件, 也极大的降低了复杂控件的设计难度 。 **【强制】** 开发react、react-native项目时应遵循此开发规范。 * 示例 ![](https://box.kancloud.cn/64e7cd5622d802e34dd818e32688d98a_1849x526.png) ``` 如图所示, AssignNormalHomeWork.js, AssignSpecialHomeWork.js, FastAssignHomePage.js 都有选择日期,选择时间,选择班级的操作。 我们将这三个view抽离成三个组件,界面无需关心组件如何实现,只需按照约定传递对应的值即可,选择后组件会将结果传递回去。 如果以后需要改日期选择的样式,只需改动组件,而非像没有抽离成组件之前,改动三个界面甚至更多。 这只是一个简单的组件化编程示例,可能还会遇到将一个复杂的组件抽离成多个子组件等等业务场景,大同小异! ``` * 简述目录结构 ``` 如图所示,这是爱老师教师端作业版块下布的置作业模块 在assign目录下创建当前业务模块所需的component、page、util 这样目录结构一目了然,修改维护也更方便。 ```