RN开发规范

[wuyunqiang]

Created by wuyunqiang
驼峰式：第二个单词首字母大写
大驼峰式：每个单词的首字母都是大写的
默认是驼峰式

一:文件

1：文件夹 全部小写字母
例如：page，component，assets

2：js文件 大驼峰式规范
页面Page结尾
工具Util结尾
原生组件Android||IOS结尾 最后统一导出
例如：
HomePage
HttpUtil
WebAndroid||WebIOS=>统一在Web.js里面导出

二:变量

禁止使用var

实例变量let
实例常量const
静态属性static

1：全局属性(项目启动即引用) 全部大写
例如：
global.WIDTH = deviceWidth;

2：静态属性(局部页面使用,使用才引用) 类型+驼峰式命名
例如：
Array a aNameList
string s sName
Boolean b bVisible
Float f fMoney
Function fn fnMethod
Int i iAge
Object o oType
Regexp re rePattern(正则表达式)
可变类型 v vObj
例如：

引用方式通过 类名+变量名
CacheData.sPhone = "";
CacheData.sToken = "";
CacheData.oPerson = {};

3：类变量(需要更新UI 不需要更新UI) 类型+驼峰式命名

需要更新UI
this.state = {
    bFlag:true,
    sNum:"",
    oPerson:{},
}
不需要更新UI
this.bFlag=true
this.sNum = ""
this.oPerson = {}

4:实例变量 _{驼峰式组件名字}

this.refs._textInput
this._scrollView

三:方法

1：静态方法 大驼峰式

例如：
Http.Post()
Cache.GetToken()

2：功能型

  can,is,get,set,init,show,hide,query,sort,check,
  名称+业务名称 驼峰式命名

3：动作型 xxxxAction

  由用户触发的操作,第一个函数一定是Action 

例如：用户点击登录函数调用如下
loginAction(点击事件)->checkData(功能型)->(功能型)->(功能型)->Http.Post(this.state.oUser)

4：回调型

1：父子组件间回调 onXXX

 例如：
  return (<Parent> 
                   <Son1 sName={this.state.sName} onShowDialog={this.showDialog}/>
                </Parent>)
//子组件使用
//this.props.onShowDialog(this.state.bVisible);

2：页面回调 XXXCallBack

2.1:
A navigate B

A页面
 loginCallBack =(data)=>{doSometing}
 this.props.navigation.navigate(page,{loginCallBack:this.loginCallBack});

B页面执行
loginCallBack(data)

2.2:
A通过回调监听B页面的广播

//A页面
 DeviceEventEmitter.addListener('isLogin',(data)=>{
            this.loginCallBack(data)
        });
 //B页面
 DeviceEventEmitter.emit('isLogin', data);

四:组件化

禁止在render方法里面写太多代码

纯组件：独立于事件，业务，每个项目都可以复用。
业务组件：和本项目相关联
页面：都多个业务组件组合