真正理解下什么是优秀的UI体验！
当我们开始将应用中一些可复用的功能单元封装成一个个业务组件或基础组件时，这个过程就叫做组件化。当独立的组件数量足够多时，就需要考虑将这些组件在更高层次上封装，即「组件库」，以便更好地管理它们。
在这里，我们先来聊一聊组件化？
「组件化」是“现代前端应用的核心要素之一，贯彻的理念是：组合优于继承，在功能层面上对交互与设计实现拆分与组装。
组件化的目的是：实现独立功能UI的可维护性、可测试性以及更高层次的复用性。
基于此，我们来给组件化下一个定义：将一个具有完备通用功能的UI单元，划分为结构(模板)、样式和逻辑，在内部管理最小可用的状态满足基本的交互需求，对外提供属性接口满足用户自定义需求。
同时，需要注意的是组件化是现代前端工程化的重要基础之一。
如何设计一个优秀的组件呢？
一些建议如下：
将设计图划分为最小组件层级，保证组件的功能单一性；
预设统一的组件规范，使用一致性的规范创建组件的静态版本；
确定组件内部最小的和完整的状态属性；
明确数据流的传递方式。
另一个需要注意的问题是模块化，它有可能与组件化混淆，先来看个例子，一个文件名为Button.tsx的Button组件，内容如下：
exportinterfaceButtonProps{label:string;size?:number;[index:string]:any;}exportconstButton=(props:ButtonProps)={}
在前端中，模块指的是Button.tsx这个文件，组件指的文件中导出的Button函数。可以看出，模块化是在文件层面对代码与资源进行拆分和组装，组件化是在功能层面上对交互与设计进行拆分和组装
回到ReactNative，它的组件封装与web组件有什么区别？我们又需要注意哪些问题？
任何一个组件都是由结构、逻辑以及样式三部分组成，那么今天我们就聊一聊样式相关的问题。
样式官方文档：