11react-native-boilerplate
22=======
33
4+ * react => 16.3.1
5+ * react-native => 0.55.4
6+
7+ | verison| plug-in| note|
8+ | :---:| :---:| :---:|
9+ | [ 0.0.1] ( https://github.com/china-english/react-native-boilerplate/releases/tag/0.0.1 ) | react-native-router-flux,native-base,redux-immutable,redux-saga| |
10+ | [ 0.1.0] ( https://github.com/china-english/react-native-boilerplate/releases/tag/0.1.0 ) | redux-form| 在 0.0.1 的基础上添加 redux-form|
11+ | [ 0.1.1] ( https://github.com/china-english/react-native-boilerplate/releases/tag/0.1.1 ) | redux-form| 在 0.1.0 的基础上添加 redux-form 生成器|
12+ | [ 0.2.0] ( https://github.com/china-english/react-native-boilerplate/releases/tag/0.2.0 ) | story-book| |
13+
14+
415插件介绍
516--------
17+
6181 . [ react => 16.3.1] ( https://5b05c94e0733d530fd1fafe0--reactjs.netlify.com/docs/hello-world.html )
19+
7202 . [ react-native => 0.55.4] ( https://facebook.github.io/react-native/docs/0.55/getting-started.html )
21+
8223 . [ native-base => 2.6.1] ( https://docs.nativebase.io/Components.html#Components )
23+
9244 . [ prop-types => 15.6.2] ( https://github.com/facebook/prop-types )
25+
10265 . [ react-native-router-flux => 4.0.0-beta.31] ( https://github.com/aksonov/react-native-router-flux )
27+
11286 . [ redux-saga => 0.16.0] ( https://redux-saga.js.org/ )
29+
12307 . [ redux-immutable => 4.0.0] ( https://github.com/gajus/redux-immutable )
31+
13328 . [ redux-form => 7.4.2] ( https://redux-form.com/7.4.2/examples/ )
1433
1534开始使用
@@ -26,35 +45,73 @@ react-native-boilerplate
2645模版生成器的使用
2746---------
2847### container
48+
2949 1 . ``` npm run generate ``` ,然后选择 container 选项;
50+
3051 2 . container 分三类:Component, stateless function, pureComponent;
52+
3153 3 . 输入 container 的名字;
54+
3255 4 . container 是否需要链接 route;
56+
3357 5 . 输入 route 的名字;
58+
3459 6 . 是否需要 app 的 header 部分;
60+
3561 7 . 是否需要 app 的 footer 部分;
62+
3663 8 . 是否需要进行数据交互(action、redux...);
64+
3765 9 . 是否需要 saga;
66+
3867 > 当 container 的类型为 stateless function 时,8、9不会进行 <br />
3968 > 当 container 不需要链接 route 的时候,5不会执行<br />
4069 > 当 container 需要链接 route 的时候,会自动在 route 中添加相关 route
4170
4271### component
72+
4373 1 . ``` npm run generate ``` ,然后选择 component 选项;
74+
4475 2 . component 分三类:Component, stateless function, pureComponent;
76+
4577 3 . 输入 component 的名字;
4678
79+ 4 . 是否需要链接 storybook;
80+
81+ > 链接到 storybook 时,自动分类为 component
82+
4783### form
84+
4885 1 . ``` npm run generate ``` ,然后选择 form 选项;
49- 2 . 同 component
86+
87+ 2 . form 分三类:Component, stateless function, pureComponent;
88+
89+ 3 . 输入 form 的名字;
90+
91+ 4 . 是否需要链接 storybook;
92+
93+ > 链接到 storybook 时,自动分类为 form
5094
5195### formField
96+
5297 1 . ``` npm run generate ``` ,然后选择 formField;
98+
5399 2 . 输入 formField 的名字;
100+
101+ 3 . 是否需要链接 storybook;
102+
54103 > formField 生成时会自动修改相关引入文件,你只需要在 form 文件中修改相应的 formField type 名即可.
104+ > 链接到 storybook 时,自动分类为 formField
55105
56106
57- 持续更新中...
107+ storybook 的使用
58108-------
59109
60- 1 . 添加 story-book;
110+ 1 . ``` npm run storybook ```
111+
112+ 2 . ``` react-native run-ios or react-native run-android ```
113+
114+ 3 . 打开 http://localhost:7007/ 就可以测试已有的组件了
115+
116+ > 当你运行 storybook 时,你的应用将无法运行(被 storybook 覆盖),想要返回应用时,需要停止 ``` npm run storybook ``` 重跑 ``` npm start ``` <br />
117+ > 当你使用 native-base 时,存在两个特殊组件( header 和 container ),已将其单独处理。
0 commit comments