开发中遇到的问题-移动端

开发中遇到的问题-移动端

点击查看代码

1 使用 Link 去跳转的时候，发现浏览器的地址栏的确 url 变了，
但是这个页面的内容没有发现变化
在路由匹配的组件上加上 exact 属性
 
2 页面刷新后, 轮播图无法自动滚动
在 state 中添加轮播图数据是否加载完成的状态，在轮播图数据加载完成时候，修改这
个状态为 true
 
3 在展示城市列表会导致页面卡顿，滚动不流畅等性能问题，
导致移动设备耗电加快，影响移动设备的电池寿命
通过第三方 react-virtualized 组件，实现只渲染页面可视区域的列表项，非可视区域的
数据完全不渲染(预加载前面几项和后面几项)，在滚动列表时动态更新列表项
 
4 点击单词索引让 List 滚动到对应城市
点击索引无法正确定位的问题，调用 List 组件的 measureAllRows 方法，提前计算高度
来解决
 
5 组件之间样式覆盖问题
1、利用 CSS Modules 解决组件之间样式覆盖的问题；2、写不同的类名 (不推荐)
 
6 组件中获取到路由信息
默认情况下，只有路由 Route 直接渲染的组件才能够获取到路由信息，如果需要在其
他组件中获取到路由信息可以通过 withRouter 高阶组件来获取
 
7List 组件只让组件自身出现滚动条，无法让整个页面滚动，
也就无法实现标题吸顶功能
使用 WindowScroller 高阶组件，让 List 组件跟随页面滚动（为 List 组件提供状态，同时
还需要设置 List 组件的 autoHeight 属性）
 
8 当页面滚动上某个位置 filter 就固定不动(fixed)--滚道对应
位置又还原位置
我们用一个跟筛选栏相同的占位 div 元素默认是 0 高 固定定位留出位置设置为那个高
度比如 50 正好，在筛选栏脱标后，代替它撑起高度
 
9 手机触摸屏有 300ms
使用 fastclick.js 插件

__EOF__

本文作者：Sternstunde
本文链接：https://www.cnblogs.com/strundent/p/16883626.html
关于博主：评论和私信会在第一时间回复。或者直接私信我。
版权声明：本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！
声援博主：如果您觉得文章对您有帮助，可以点击文章右下角【推荐】一下。您的鼓励是博主的最大动力！