React组件规范

文件命名

• 每一个文件只包含一个组件，每一个基本组件只包含单一功能  
• 如果文件返回是一个类，文件名首字母大写  
• 测试用例文件名使用.spec.jsx后缀  
• 每一个组件使用一个单独的测试用例文件  

Js规范

• 使用es6+开发，尽量使用常用的ES6+语法  
• 使用jsx语法  
• 组件文件命名使用大驼峰， ComponentDemo  
• 带命名空间的组件，如果一个组件包含只有自身使用的子组件，以该组件为命名空间编写组件，例如Table，Table.Head  
• 不使用displayName命名  
• 自定义属性使用data-  
• 使用propTypes进行props类型校验  
• 使用defaultProps定义默认参数  
• 定义props避开react关键字及保留字，常用的props及state定义可参考下表  
• 尽量少或者不使用ref获取和操作dom节点，使用state和prop进行控制dom，如遇必须使用的情况，添加详细注释信息  
• 事件调用使用在元素上onClick调用  
• 注意，react和html的表单元素的差异  
• 不支持mixin，使用decorator进行扩展和高阶组件方式扩展。  
• 不能私自添加第三方js库，如需要使用，必须通知本组组长，并在工作群里提出，At所有前端负责人，经讨论后再添加
• 尽量多而有用的代码注释，方法使用块级注释  
• 避免使用定时器类的编码，如必须使用，需添加详细注释，各组长合并代码时需要审查是否合理，合确认是否含有销毁方法  
• 自身定义的props属性应避免与react的关键字相同  

样式规范

• 在添加src/style/theme/default.sess中添加公共样式变量，各开发人员尽可能使用里面定义的公共样式变量  
• 组件多样式调用，使用classnames模块，进行样式处理，使用className调用  
• 所有组件类名命名以‘expo-’开头  

通用组件接口规范

参考链接

airbnb规范

代码规范