微网站设计规范 第1篇
以图片组件为例：
image下面为组件的属性，由云端接口直接返回，items下面的每一项对应单个图片属性，右侧配置区域可对每个属性进行配置，每上传一张图片，往items里增加一项
4. 视图组件结构和对应样式
类名为component-wrapper的图层为最外层，宽度为屏幕宽度100%（后台预览页面宽度定为375px），为这个图层设置左右padding值为组件传过来的pageMargin的大小
微网站设计规范 第2篇
components目录放一些常用的组件，和分别为左侧和右侧的集成组件
configComponents目录是右侧显示的对应组件和页面的配置相关的组件，每个组件对应一个配置，封装成对应的组件
viewComponents目录放置组件对应的样式结构代码，每个组件封装成一个样式组件，名称和配置组件一一对应
为整合页面，分别调用左侧的组件和右侧的组件，以及中间预览遍历组件按需加载样式组件
微网站设计规范 第3篇
小程序端的页面样式和结构可以部分复用viewComponents中的代码，只需将结构标签div改为view，将img改为image，v-if改为wx:if，v-for改为wx:for对应组件放在根目录下的custom-components下的microPage目录里
主页面放在subpackage下面的microPage下
循环遍历传过来的页面组件数据，渲染不同的组件拿image图片组件举例，它的结构代码
由于小程序里面不支持动态样式绑定，我们将样式拼接成字符串，加入到组件列表里，另外后台传过来的像素单位是px，需要做转化rpx
像素单位转化方法封装在app下