1. 用weex实现页面跳转？
1.1 使用vue-router
position: fixed/sticky 的元素，在切换页面后不会消失
image.png
1.2 使用navigator 作为跳转方案
通过谷歌、百度出来都方案, 都比较复杂，折腾了两天未实现。
2. css支持性
2.1 选择器只支持单个类名选择器
# bad
.the-article .title {}
# good
.the-articel__title {}
2.2 css单位不支持em,rem,百分比
# bad
.the-article {
width: 100%;
}
# good
.the-articel {
width: 750px;
}
2.3 布局只能使用Flexbox, 不支持内联布局display: inline/float
例如下面的 文字加粗 效果无法实现
image.png
2.4 不支持align-self: stretch, 无法实现两列等高布局
2.5 不支持负边距
# bad
.the-image {
margin-left: -10px;
}
# good
.the-image {
transform: translateX(-10px);
}
2.6 不支持z-index, 没有层级概念, 靠后都元素层级更高
2.7 伪类选择器只支持active focus disabled enabled
# bad
.list-item:first-of-type {}
.list-item:last-of-type {}
.list-item:before {}
.list-item:after {}
# good
.list-item--first {}
.list-item--last {}
2.8 不支持背景图片
background-image: url(***);
3. js & vue 的支持性
3.1 不支持按需加载
# bad
const Home = () => import('@/pages/home')
# good
const Home = require('@/pages/home')
# or
import Home from '@/pages/home'
3.2 不支持事件修饰符
# bad
<div @click.native>
<div @click.stop>
3.3 clss不支持常规写法
# bad
<div :calss="{'is-active': isActive }">
# good
<div :class="[isActive && 'is-active']">
3.4 不支持触发/监听原生事件
# bad
this.$on('click', () => {})
this.$emit('click', '啦啦啦')
# good
this.$on('btnClick', () => {})
this.$emit('btnClick', '啦啦啦')
3.5 不支持组件缓存
# bad
<keep-alive>
<my-component />
</keep-alive>
3.6 不支持定时器setInterval, 只能用setTimeout模拟
4. 支持加载网络图片,不支持加载本地图片, 如需支持, 需要先在android 和 ios 端代码中分别实现。
5. 纵向scroller不能嵌套同向scroller或list，例：纵向scroller不能嵌套同向scroller或list
6. list组件, ios要设置高度，否则不显示
<list style="height: 1000px;">...</list>
7. eslint的waining要解决调，否则打包失败
8. 内置组件如slider, 样式只能通过特定的css属性修改
# 修改轮播图小点的颜色
.base-slider__indicator {
item-color: #cdcfd0;
item-selected-color: #00ae66;
}
9. 所有文字必须用<text> 包裹，否则样式在真机上不生效。text不能再包含其他标签。
# bad
<div>大师兄，师傅被妖怪抓走了</div>
# bad
<text>
<text>大师兄，二师兄被妖怪抓走了<text>
</text>
# good
<text>大师兄，我被妖怪抓走了<text>
10. 社区不活跃，资料不足，文档简单，第三方支持太弱。出了问题找不到解决方案。
11. 不支持的api，调试工具不报错，无法定位问题。
好的地方
- 自动做响应式布局, 开发过程只需要按照设计稿尺寸写像素值px
- image组件支持默认图片, 支持图片自适应
- css属性lines, 简化多行超出点点点的实现
- refresh支持下拉刷新
- slider 轮播图组件
- scroll、list 滚动组件
- modal 弹框组件
- animation 转场动画
- 其他app原生能力
