1.实现页面之间的切换效果
参考这个项目:https://github.com/zhengguorong/pageAinimate
2.ios页面的滚动效果(两种解决办法)
<1>使用better-scroll插件
我们当时使用它时,需要知道滚动区域的具体高度
<2>在滚动区域加以下标签(推荐)
-webkit-overflow-scrolling: touch
3.有事件代理的标签在ios下点击时会有阴影效果
加这个标签就可以解决
-webkit-tap-highlight-color:rgba(255,255,255,0);
4.默认图片找不到路径
<img :src="item.ad_img" :onerror="defaultImg" />
defaultImg: 'this.src="' + require('../../../static/img/default.jpg') + '"'
5.滚动加载数据
我们使用的是mint-ui中的Infinite scroll
6.下拉刷新
也是mint-ui中的Loadmore
7.菜单切换的过渡效果以及自动滚动
请参考另外一篇文章
滚动栏git地址:https://github.com/fanjun123/slider
8.保存页面滚动条位置
刚开始用的是vue的keep-alive,但是在使用的过程中发现许多问题:
<1>页面只能保存一个,如果两个相邻的页面都添加了keep-alive属性就会失效
<2>因为我们的项目在最外层加了页面切换的效果,使用keep-alive后就触发不了过渡效果了
<3>keep-alive只能把保存页面的数据,保存不了滚动的位置,可以把滚动位置通过变量保存也可以
由于以上原因,我最后放弃使用keep-alive,决定使用vuex保存页面的滚动位置,请求的数据,虽然麻烦点,但效果不错