美文网首页
WEEX开发总结

WEEX开发总结

作者: 吴高亮 | 来源:发表于2017-12-22 12:02 被阅读0次
image.png

1:上拉加载更多使用的函数;


image.png

在最开始使用的是loading这个组件;在短链接的情况下就会出现;滑动就加载;无论是否滑动到底部;
在使用list中的loadmore这个函数的时候;就会出现在短连接的情况下无法触发loadmore函数;
是这样处理的兼容性


image.png
image.png

2:ref中的topnode;是做的回到顶部的兼容;


image.png

在短连接中;使用dom.scrollToElement(el,{});这个方法是没有作用的,在长链接夏是正常的;就使用window.scroll(0,0);做兼容处理;

3:关于appear 和 disappear 方法的兼容;


image.png

;
在短连接的情况下;会直接执行appear函数;无论是否可见;disappear函数在短连接的情况下是不触发的;
具体的处理方案长链接正常使用;短连接的情况使用window.onscroll;来解决;

4:关于list中header组件的使用;


image.png
image.png

使用header组件,在长链接的情况下实现滑动到该位置,该模块吸顶,但是在短连接的情况下是不行的;
需要用正常的方式就行判断;

5:底部定位遮盖的问题;


image.png
image.png

这个空标签的使用是因为底部导航是固定定位;一般咱的处理方式是要给遮盖的那部分模块父级设置margin或者padding;但是在长短连接的还有安卓IOS的情况下会有不同的兼容问题

6:跳转以及数据请求的链接问题;


image.png
image.png

数据请求问题还有跳转问题;对于参数需要使用encodeURIComponent;进行编码;不要全部编码;

7:关于IOS8对于弹性盒模型的兼容问题;


image.png

实现上下左右居中;


image.png
横向排列;
image.png

实现justify-content:space-around;的效果;

8:其他问题:
在IOS上;如果你在CSS中设置了宽;'width:0;';你想要动态的改变这个元素的宽的话,该元素在IOS长链接的情况下,会首先闪一下变成你要设置的宽;最后会再次变成0;
还用对于行内元素;使用动画设置高宽的时候;无论是否设置display:block;均会报错;说style为not defind;

9:轮播图指示器的问题
在现在的开发环境下,使用的为vue2.5.3版本的;使用的时候就会报错;具体原因不清楚;但是使用行内样式;但是不要写px单位就会正常


image.png image.png

相关文章

  • weex开发总结

    最近用weex开发了新浪众测app的iOS端(因开发时间紧迫,前期仅开发了iOS端,年后会继续开发Android)...

  • WEEX开发总结

    1:上拉加载更多使用的函数; 在最开始使用的是loading这个组件;在短链接的情况下就会出现;滑动就加载;无论是...

  • weex开发总结

    首先你需要必备的网站教程: 1.weex官网教程:http://weex.apache.org/cn/guide/...

  • Weex开发总结

    2018年01月21日文章、多段投放策略16年文章、安卓接入Weex18年文章、Weex发布策略19年文章、wee...

  • weex 环境搭建一 weex-toolkit

    weex开发, 安装nodejs 、weex-toolkit 、weex-pack weex官网文档:http:/...

  • (26)打鸡儿教你Vue.js

    weex框架的使用 1、weex开发入门2、weex开发环境搭建3、掌握部分weex组件模块4、了解一些vue基本...

  • [个人记录]Weex入坑

    Weex入门 官方文档 文档iOS集成 开发环境配置 安装node 安装weex开发工具 验证 weex-tool...

  • weex常见问题解析

    什么是 Weex? Weex 是使用流行的 Web 开发体验来开发高性能原生应用的框架。 Weex 致力于使开发者...

  • weex入门-Write Once, Run Everywher

    什么是 Weex ? Weex 是一个使用 Web 开发体验来开发高性能原生应用的框架。 Weex 致力于使开发者...

  • Weex项目构建流程

    Weex-Toolkit Weex-Toolkit 主要用于快速构建 weex 的项目并且开发和调试。 Weex...

网友评论

      本文标题:WEEX开发总结

      本文链接:https://www.haomeiwen.com/subject/elktgxtx.html