亮点1.布局灵活
多种定位方式
画布组件支持绝对定位/静态定位/弹性盒子布局定位
弹性盒子深度无限
弹性盒子采用树状数据结构，支持无限向下生成子盒子
横向/纵向排布
弹性盒子布局定位方式下，可设置弹性盒子的主轴，设置盒子内组件分布反向与分布方式
导出文件格式多样
支持一键网站发布/预览功能，支持html、vue以及json文件导出，便于开发人员进一步对系统进行丰富
支持json文件导入
开发人员通过json文件导入网页布局模板、复杂组件，或未完成的网页继续进行搭建。
难点1.渲染器的实现
渲染组件
首先一个大型组件PowerfulDynamicDraw，会接收用户点击之后生成的树形结构数据
递归遍历
组件对该结构进行遍历，如果遍历到包含子节点数组的数据则将数据发给递归FlexBox渲染器，其余发给具体的物料组件
遍历树渲染
FlexBox渲染器接收到数据之后利用数据中的style样式对自身进行渲染，同时递归调用自身的动态组件component
难点2.递归操作dom生成文件
1.首先提前准备好html模版和每个组件的字符串，并利用浏览器提供的appendChild和innerHtml的api，实现将字符串和dom相互转换的方法
2.导出过程中exportHtml接收到一个views数组，数组中每个节点都是树形结构，遍历views数组图中将树形结构传入一个递归生成dom的方法
3.该方法将数据中的style对象通过正则表达式还原成浏览器支持的格式同时根据数据中的component属性对应出提前准备好的字符串，再配合浏览器api将其转换为dom
4.那么有了dom之后我们就可以为其动态的添加类名和属性，同时通过类名对应好生成的样式字符串- 最终生成html文件主要内容的dom字符串和样式字符串，我们利用模版字符串将其拼接到最后的html/vue文件模版，并利用FileSaver将文件导出
