forgetest5
/
react-components-docs
1
0
Fork 1
Code Issues Pull Requests Releases Wiki Activity

add new components png

This commit is contained in:
BoyuZhou 2017-11-15 14:00:38 +08:00
parent 6442be2e6f
commit 621702a0ba
4 changed files with 43 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
.idea/workspace.xml
View File

@ -3,7 +3,6 @@
<component name="ChangeListManager">
<list default="true" id="e6268886-b616-4b3f-a001-08a3385e36ae" name="Default" comment="">
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/.idea/workspace.xml" afterPath="$PROJECT_DIR$/.idea/workspace.xml" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/如何写一个标准的react组件.md" afterPath="$PROJECT_DIR$/如何写一个标准的react组件.md" />
</list>
<ignored path="$PROJECT_DIR$/.tmp/" />
<ignored path="$PROJECT_DIR$/temp/" />
@ -69,9 +68,8 @@
</component>
<component name="ProjectFrameBounds">
<option name="x" value="-8" />
<option name="y" value="-8" />
<option name="width" value="1936" />
<option name="height" value="1096" />
<option name="width" value="1228" />
<option name="height" value="1084" />
</component>
<component name="ProjectLevelVcsManager">
<ConfirmationsSetting value="2" id="Add" />
@ -209,24 +207,23 @@
<updated>1502951840899</updated>
<workItem from="1502951842356" duration="3929000" />
<workItem from="1503381253636" duration="5666000" />
<workItem from="1503456051856" duration="778000" />
<workItem from="1503456051856" duration="836000" />
</task>
<servers />
</component>
<component name="TimeTrackingManager">
<option name="totallyTimeSpent" value="10373000" />
<option name="totallyTimeSpent" value="10431000" />
</component>
<component name="ToolWindowManager">
<frame x="-8" y="-8" width="1936" height="1096" extended-state="6" />
<editor active="true" />
<frame x="-8" y="0" width="1228" height="1084" extended-state="0" />
<layout>
<window_info id="Project" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" show_stripe_button="true" weight="0.11433087" sideWeight="0.5" order="0" side_tool="false" content_ui="combo" />
<window_info id="Project" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" show_stripe_button="true" weight="0.18235295" sideWeight="0.5" order="0" side_tool="false" content_ui="combo" />
<window_info id="TODO" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="6" side_tool="false" content_ui="tabs" />
<window_info id="Event Log" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="7" side_tool="true" content_ui="tabs" />
<window_info id="Run" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="2" side_tool="false" content_ui="tabs" />
<window_info id="Version Control" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="7" side_tool="false" content_ui="tabs" />
<window_info id="Structure" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.25" sideWeight="0.5" order="1" side_tool="false" content_ui="tabs" />
<window_info id="Terminal" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="7" side_tool="false" content_ui="tabs" />
<window_info id="Terminal" active="true" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" show_stripe_button="true" weight="0.3336842" sideWeight="0.5" order="7" side_tool="false" content_ui="tabs" />
<window_info id="Debug" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.4" sideWeight="0.5" order="3" side_tool="false" content_ui="tabs" />
<window_info id="Favorites" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="2" side_tool="true" content_ui="tabs" />
<window_info id="Cvs" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.25" sideWeight="0.5" order="4" side_tool="false" content_ui="tabs" />

BIN
img/tinper-bee-0.6.0.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 264 KiB

BIN
img/tinper-bee.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 264 KiB

After

Width:  |  Height:  |  Size: 258 KiB

36
react编码规范.md
View File

@ -10,19 +10,55 @@
- 每一个组件使用一个单独的测试用例文件
## js规范
### 语法
- 使用es6开发，尽量使用常用的ES6语法，(ES6语法参考)[http://es6.ruanyifeng.com/]
- 使用jsx语法
### 命名规范
- 组件仓库命名为小写和“-”连接，如button、button-group
- 组件文件命名使用大驼峰， ComponentDemo
- 带命名空间的组件，如果一个组件包含只有自身使用的子组件，以该组件为命名空间编写组件，例如Table，Table.Head
### 组件属性及写法规范
- 不使用displayName命名
组件不使用displayName
- 自定义属性使用data-
赋值给dom的自定义属性，使用`data-xxx=xxx`的形式
```
```
- 使用propTypes进行props类型校验
- 使用defaultProps定义默认参数
- 定义props避开react关键字及保留字，常用的props及state定义可参考下表
- 尽量少或者不使用ref获取和操作dom节点，使用state和prop进行控制dom
- 事件调用使用在元素上onClick调用
```
//bad
<div ref='demo' ></div>
//good
handleClick = (e) => {}
...
<div onClick={this.handleClick} ></div>
```
- 注意，react和html的表单元素的差异
- 使用es6后，不支持mixin，使用decorator进行扩展，（babel？需要增加解析器）和高阶组件方式扩展。
- 尽量不使用比较大的第三方js库
- 组件方法定义顺序 constructor --> 声明周期方法(componentWillMount,componentDidMount,