关于better-scroll自动回滚的坑

最新推荐文章于 2022-03-23 15:58:15 发布
最新推荐文章于 2022-03-23 15:58:15 发布
阅读量1.4k 收藏
点赞数 1
分类专栏： 开发时遇到的坑 文章标签： better-scroll 坑
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43677445/article/details/103195773
版权

最近在写一个商城项目，遇到一个better-scroll的问题

用户跳回首页时肯定是要在之前浏览的位置，用到keep-alive。但是出现了当回到首页时会自动回滚到顶部的问题。

原因：轮播图的自动轮播（商城项目肯定是有轮播图的），页面数据的变动使better-sceoll的transform变为0。

解决方法：activated以及deactivated函数中使轮播的定时器开启和关闭。

有地方不对的话，希望大佬指正我

独→白
关注
专栏目录
上拉加载下拉刷新（better-scroll)
u013262823的博客
06-14 5621
前端实现一个上拉加载，下拉刷新，并且滑动一定的位置能够实现回到顶部的功能。这个在移动端上来说是一个很常见的功能。之前有看到有人用bette-scroll库来实现这个功能。 最基本的初始化代码如下： import BScroll from 'better-scroll' let wrapper = document.querySelector('.wrapper') let scroll = new...
better-scroll 在ios下，滑动过快时触发回弹(看到滑动之后，又弹回原处再次滑动)
前端切图仔的日常
08-10 1334
问题出现背景： IOS版本：13.4版本，在Safari以及iphone微信下在better-scroll区域快速滑动时，均会出现该问题 处理办法 经查询是better-scroll插件在ios下的兼容性问题，github下有对应issue 目前插件在2.x版本已修复该问题，如果还在使用1.x，需要升级到2.x版本，1.x版本下插件作者目前尚未修复该bug 备注 better-scroll 2.x文档 ...
解决better-scroll下拉加载更多后，自动滚动到顶部的问题
weixin_48008551的博客
03-23 1233
当监听数据更新后，再次触发初始化，页面列表自动滚动到顶部，要想保持原位置，禁止当前滚动即可。 这里只会这个方法，如果有更好的方法，欢迎解答。 官方文档里有stop方法 stop() 参数：无 返回值：无 作用：立即停止当前运行的滚动动画。 init() { this.listScroll =new BScroll('.wrapper',{ probeType: 3, startY:true, c
关于better-scroll每次上拉刷新后回到顶部的解决方案
qq_43638621的博客
03-21 4508
关于better-scroll每次上拉刷新后回到顶部的解决方案 相信很多朋友在使用better-scroll插件的时候，好不容易配置好后，在使用上拉刷新功能的时候，会遇到这个很让人头疼的问题，每次刷新后都回到顶部，又得往下翻，体验度极地，我也是遇到这个问题，百度了一下网上没有这个解决方案，就自己琢磨了一下，想到极其简单的解决方案，不喜吻喷 let self = this;//改变this...
better-scroll快速滑动，出现异常回弹
阑珊伊人
06-03 2488
原因： better-scroll在IOS 13.4版本上快速滑动，回出现异常回弹效果。这是由于IOS版本导致的。 解决办法： 在BS初始化时，加上useTransition:false github相关issues: iOS 13.4 下 bounce 存在异常
vue使用better-scroll实现菜单列表左右联动
07-13
而 Better-Scroll 是一个强大的滚动插件，它能帮助开发者在移动设备或者浏览器上实现高性能、易用的滚动效果。在本篇文章中，我们将深入探讨如何在 Vue 项目中利用 Better-Scroll 实现菜单列表的左右联动功能。 ...
Vue + better-scroll 实现移动端字母索引导航功能
08-27
Vue + better-scroll 实现移动端字母索引导航功能 Better-scroll 是一款重点解决移动端（已支持 PC）各种滚动场景需求的插件。它的核心是借鉴了 iscroll 的实现，其 API 设计基本兼容 iscroll，在 iscroll 的基础上...
详解 vue better-scroll滚动插件排坑
08-28
vue better-scroll 滚动插件详解 BetterScroll 是一款移动端滚动插件，它的强大之处是解决移动端（已支持 PC）各种滚动场景需求的插件。BetterScroll 的核心是借鉴的 iScroll 的实现，它的 API 设计基本兼容 ...
vue better-scroll插件使用详解
08-28
vue better-scroll插件使用详解 本篇文章主要介绍了vue better-scroll插件的使用详解，better-scroll是一个移动端滚动的解决方案，它基于iscroll的重写，具有强大的功能，可以实现普通的滚动列表、轮播图、picker...
Vue项目中使用better-scroll实现一个轮播图自动播放功能
10-17
better-scroll是一个非常非常强大的第三方库 在移动端利用这个库 不仅可以实现一个非常类似原生ScrollView的效果 也可以实现一个轮播图的效果。这篇文章主要介绍了Vue项目中使用better-scroll实现一个轮播图,需要的...
实现一个返回顶部的按钮功能（基于better-scroll实现）
weixin_57399180的博客
06-17 483
better-scroll:是一款重点解决移动端（已支持 PC）各种滚动场景需求的插件。 gitHub地址：https://github.com/ustbhuangyi/better-scroll 中文文档：
better-scroll在最新的ios13.4版本上页面回弹异常
weixin_45115895的博客
05-18 661
最近的一个vue项目,客户提出在滑动到底部或顶部过快,会出现页面回弹,刚开始我以为是我自己哪里设置有问题,后来测试发现是ios版本问题 在ios刚升级的13.4版本上滑动到底部或顶部过快,就会出现页面回弹,首先想到在BS初始化时设置了禁止回弹:bounce:fasle,结果确实不回弹了,但是到底部或者顶部时整个页面会突然的闪一下,所以此路不通 后来问了同事,说在git上有个issue #978 就是关于这个问题的讨论,然后我就去找了一下,链接如下:https://github.com/ustbhuangyi
better-scroll 踩坑
NINI_stu的博客
03-19 387
better-scroll 踩坑合集 better-scroll 失效 根据 better-scroll 的实现原理，子元素应当比给 BS 的父元素大； better-scroll 只会对第一个子元素有效，因此一般给使用的元素包裹一层父元素； 无法响应鼠标滚轮滚动 better-scroll 无法点击，只需在创建时配置 click 为 true； better-scroll 无法实现内容滚...
当 better-scroll 遇见 Vue
weixin_33812433的博客
06-01 4032
作者：滴滴公共前端 黄轶 在我们日常的移动端项目开发中，处理滚动列表是再常见不过的需求了。 以滴滴为例，可以是这样竖向滚动的列表，如图所示： 竖向列表 也可以是横向滚动的导航栏，如图所示： 横向列表 可以打开“微信 —> 钱包—>滴滴出行”体验效果。 我们在实现这类滚动功能的时候，会用到我写的第三方库，better-scroll。 什么是 better-scroll better-...
关闭better-scroll滚动到最底部或者顶部的弹性效果
weixin_43756060的博客
02-21 8424
添加bounce: false就可以了 mounted () { this.scroll = new BScroll(this.$refs.wrapper, { probeType: 3, click: true, bounce: false }) }
vue中使用better-scroll实现滑动以及左右联动效果
mm_hello11的博客
04-05 7672
一、首先需要在项目中引入better-scroll 1. 在package.json 直接写入 "better-scroll":"^1.15.1" 版本以github上为准（目前最新） 2.cpnm install 在node_modules 可以查看版本是否安装 3.直接在你的组件里面写入import BScroll from 'better-scroll'; 二、better-s...
（八）在vue中使用better-scroll，实现内容区域的滚动效果，以及右边与左边内容相对应，左边呈现高亮状态
热门推荐
感恩、奋进、自信
05-03 1万+
better-scroll.js是对isScroll.js的重构，isScroll.js的github地址是：isScroll，better-scroll.js的文档手册地址是：better-scroll。下面讲讲如何在项目中使用better-scroll1、首先在项目的根目录下安装better-scroll，better-scroll是支持npm安装的，在cmd中输入下面的语句npm insta...
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值