#TonkinTalent ##下载本项目前,请安装nodejs,安装react-native基础环境,安装facebook最新的yarn管理工具。 1. 采用 git下载本工程,命令行下载如下: git clone https://git.oschina.net/zowork/TonkinTalent 2. 更新子仓库 git submodule update --init --recursive 3. cd TonkinTalent 4. yarn install/npm i 5. 运行react-native link 6. 安装完毕后, ##运行 ### ios运行 react-native run-ios react-native run-ios --simulator "iPhone 5se" COMMOND + R 重新加载 COMMOND + D 调试菜单 ### android 运行 react-native run-android adb devices 查看连接设备 ### 日志 执行: ```bash react-native log-ios react-native log-android ``` ##开发 ### 目录结构 * /img 目录下是图片请注意按照功能和页面放置图片,图片名称类似 name@2x.png * /src 下面是代码目录, * /src/pages 页面 * /src/widget 为公用组件 * /commons 目录为公用组件,参考公用组件详细说明 * /app-js-sdk 为客户端sdk 目录,使用 git子模块 ,参考git子模块说明 ### commons commons 模块集成有apis和setTimeout 函数,会在组件释放时释放相关资源 #### 代码提示 如果commons 不提示,请修改idea 或者webstorm *. 修改JavaScript 级别为flow 或者 jxf *. 把commons和app-js-sdk 加入lib(一般不需要) #### 网络请求 网络请求是标准的Promise ,唯一注意的地方是加入了default 函数处理错误情况!必须调用 支持Promise 相关并行,串行等操作 1. 修改服务器协议地址 修改 src/app.js 文件 下的 Apis.init("http://127.0.0.1:8080/","v1"); 2. 简单调用 ````javascript this.commons.apis.accountApi.login(LoginForm.form( "123456", "13910831723" )).then((m: LoginRet) => { }).default(); ```` 3.串联 ```javascript this.commons.apis.accountApi.login(LoginForm.form( "123456", "13910831723" )).then((m: LoginRet) => { return this.commons.apis.testApi.test() }).then((o: TestObject) => { return this.commons.apis.testApi.test() }).default(); ``` 4.并行 ```javascript Promise.all( [ this.commons.apis.accountApi.login(LoginForm.form( "123456", "13910831723" )), this.commons.apis.testApi.test() ] ).then((m:LoginRet,o:TestObject)=>{ }).default(); ``` #### commons 使用例子如下 ````javascript import React, {Component, PropTypes} from "react"; import {Text, View} from "react-native"; import Apis, {LoginForm, LoginRet} from "app-js-sdk"; import {Commons} from "commons"; export default class IndexView extends Component { commons: Commons = new Commons().bind(this); constructor(props) { super(props); } componentDidMount() { //登录服务器 this.commons.apis.accountApi.login(LoginForm.form( "123456", "13910831723" )).then((m: LoginRet) => { }).default(); //定时任务 this.commons.setTimeout(()=>{ },500) } render() { return <View></View>; } } console.log("IndexView", IndexView); ```` ## git子模块 **使用 根目录下的 updateApi.sh 更新api 仓库** app-js-sdk: https://git.oschina.net/hengxinAPP/app-js-sdk.git git submodule add https://git.oschina.net/hengxinAPP/app-js-sdk.git app-js-sdk git submodule 查看子仓库 初始化子仓库 git submodule init 更新子仓库 git submodule update --init --recursive 如果修改子仓库地址后用git submodule sync 同步 ##杂项 清楚缓存 rm -rf $TMPDIR/react-* // "apis": "git+https://git.oschina.net/hengxinAPP/app-js-sdk.git", ## 使用 Ant Design Mobile of React 组件库 文档:<https://mobile.ant.design/docs/react/introduce> github地址:<https://github.com/ant-design/ant-design-mobile> 安装 react-native-navigation npm install react-native-navigation@next --save ## icon和加载画面 首先安装 npm install -g yo file:./lib/generator-rn-toolbox2 npm uninstall -g yo file:./lib/generator-rn-toolbox2 yo rn-toolbox2:assets --icon icon.png yo rn-toolbox2:assets --splash splash.png --ios yo rn-toolbox2:assets --icon icon.png --splash splash.png --store node lib/generator-rn-toolbox/generators/assets/index.js 查看<https://github.com/bamlab/generator-rn-toolbox/blob/master/generators/assets/README.md> 激光 npm run configureJPush 5f8e78cbbc7a5601727b62c9 app 上线准备 1 app名字,描述,关键词,技术营销网址 2 销售范围区域 3 公司名字 4 3页最多5页进行截图(iphone5 iphone6 iphone6s)3套 5 商务代表联系方式 6 分级选项 7 演示账号 8 能ipv6 访问的 https 后端服务器 http://www.jianshu.com/p/b1b77d804254
我的第一个RN项目注意事项说明
最新推荐文章于 2024-08-01 13:45:06 发布