可视化开发

js文件命名：页面小写，组件大驼峰

Target1

拖拽进入容器区并排序：进入容器自动生成资源块，hover其他资源块进行排序，未释放移除容器删除资源块，释放则在当前未知添加

1. block拖拽进入target区，在target区域生成目标资源
2. block移出target区域，删除target中当前正在被拖拽的已生成目标资源，如何确认资源块被移出
3. 实现上述方案后，如何设计一个优雅的状态管理，? 移出资源块报如下警告;

Cannot update a component (`Container`) while rendering a different component (`Target`). To locate the bad setState() call inside `Target`

仍需要优化： 通过didDrop&两次数组深度比较的结果判断是否去更新数据源，由于didDrop值由true变为false的过程后，前述条件相比上次结果仍属于变化，多执行了一次更新数据操作。

4. 创建dev分支

DEV分支 已合并---> master

创建dev分支是为了测试，全局状态管理器(此处是Page类)，可能当前开发阶段还不适用redux、mobax等响应式设计模式，暂时称之为全局存储器吧，即：局部状态更新后有需要 存储于全局的仅仅执行一次存储方法，需要的时候再去获取，过于自动化对于从底层写一个组件并不是一个好办法；dev有阶段性的研究结果可merge master

5. drag进入target，创建预览阴影，跟随被拖拽资源块移动，drop后生成目标资源
6. 实现：资源块进入容器Target排序功能....

以上功能已经实现，但需要优化， eg. - 悬浮阴影不管是从外部拖拽进来的资源块还是内部资源块都应该保持一致 - 悬浮感应区域：一个资源块感应区域分为上右下左，当鼠标从一个方向进入移动至超过资源块中线位置时触发排序方法，这样就可以在排序前确认是否移入可释放资源块，避免连续触发抖动问题 - 当已存在资源块，再次拖拽进入一个block，如果是快速拖进且经过已存在block，dataS数据被清空？？？，需要一个标志判断isDragging的block是在悬浮区域内外 7. 左侧缩略图，移入右侧展示相应的组件 - 默认展示组件占满一整行，高度自适应 - 删除一列栅格，左侧应该只展示两列&三列,同时生成组件支持配置扩展 - 右侧组件移动拖拽至浏览器外或其他不可释放区域报错, - 左侧缩略图移入右侧，创建资源快文档改为创建灰黑色背景框？有无必要 8. 实现资源块之间嵌套 9. 实现资源块大小缩放：手动拖拽、属性配置(react-grid-layout)

DrawFlow流程

1. 解决路由history模式页面刷新后出现404的问题