作为一名页面重构，在刚开始接触weex页面开发的时候或多或少会遇到，很多感觉莫名其妙的问题，现在把最近做weex页面的想法和心得分享一下，也可以作为一个快速的入门讲解。
单位
weex的默认单位是:PX，我们先看一下官方的说法：In order to simplify the page design and the complete underlying implementation, the width of our default screen is unified to 750 pixels, different screens should be scaled with corresponding ratio.谷歌翻译一下就是：为了简化页面设计和完整的底层实现，我们默认的屏幕宽度统一为750像素，不同的屏幕应该按照相应的比例进行缩放。其实可以笼统的说weex默认就是750宽度，不管你是多大的屏幕它都给你按照750来换算，px是占比，px=dpi。wx单位：类似于锁定结构大小的单位，不随着屏幕分辨率的变化而变化。
样式
weex中的样式不支持简写所有类似margin: 0 0 5px 3px都是不支持的，是为了提高解析效率。
- weex 中只支持单个类名选择器，不支持关系选择器，也不支持属性选择器。
- 不支持行内块级元素，默认块级元素，但是支持flexbox布局。
- 仅支持border-box。
- 当前版本（V0.17）支持简单的transform（2D）样式。
- 安卓的view是有白色的默认颜色的, 而iOS如果不设置是没有默认颜色的, 这点需要注意。
- scroll组件是有个默认颜色的，如果要设置新的颜色最好是通过在组件内部进行央视控制来新增颜色。
- 不支持display:hidden;可以在整个功能模块的父级添加v-if="false"来实现消失效果。
- 注意安卓默认overflow:hidden且不可改，因此使用绝对定位的时候注意不要超过父级。
文字（text组件）
text组件只能包含文字，不能包含其他节点。
- 注意要给text组件设置font-size,对于默认值ios和h5都是32，而安卓回根据设备的不同而变化。
- 超出省略号需要 lines: 行数;搭配text-overflow: ellipsis;来使用，注意要让weex知道你的text组件是有宽度的，例如你至少要给它width或者flex:1;让weex可以计算出它的宽度，不然就没有用。
如果是遇到这种中途要变色的文字，处理起来，不同的样式的文字就要使用不同的text组件搭配样式处理，这时候要注意的是文字是否会超出换行，如果把text设置成弹性盒子，那么text组件之间的换行就会在自己当前的模块直接就换行了，不会展现行内块级元素的状态。
图片（image组件）
image组件只能包含文字，不能包含其他节点。
- 需要明确width和height，否则图片无法显示。
- 因为不支持background-image，所以要实现背景图效果的时候把image放在文档流的上方，绝对定位，因为weex的dom权重跟随文档流来，所以后面的结构就会覆盖在上面以此来实现背景图。
页面滑动（scroller组件）
当页面需要滑动的时候就需要这个组件的帮助。
- 大多数页面都会超出一屏需要滚动，因此建议把scroller当做根节点。
- 对于一些简单的页面或者页面长度不会过长的页面建议用scroller，如果页面复杂的话建议使用 list组件。
页面滑动（list组件）
拥有平滑的滚动和高效的内存管理，非常适合用于长列表的展示。
- 子组件有header，cell，refresh和loading，weex会对cell进行高效的内存回收以达到更好的性能，所以这就是为什么上面说如果页面复杂的话建议使用 list组件的原因。
- list里面只能包含上诉4个子组件，如果插入别的组件则不能被正确的渲染。
定位（absolute与fixed）
关于弹层一般我们都会用绝对定位来展示。
- 经过与前端一段时间的磨合，决定使用absolute来定位弹层，因为经过几个业务的实践总结出来，fixed的权重过于高，对于业务复杂和弹层过多的业务中，弹层的显示层级不好控制导致交互完成度不高。因此对于弹层，推荐使用absolute。
本文主要是开发过程中对于官方文档的补充，如有错误请多多指教。
附上官方文档链接：weex文档
附上官方文档链接：weex文档
我的个人博客：http://zengjinchao.com/wordpress/
