关于better-scroll自动回滚的坑

最新推荐文章于 2022-03-23 15:58:15 发布
最新推荐文章于 2022-03-23 15:58:15 发布
阅读量1.5k 收藏
点赞数 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 5632
前端实现一个上拉加载，下拉刷新，并且滑动一定的位置能够实现回到顶部的功能。这个在移动端上来说是一个很常见的功能。之前有看到有人用bette-scroll库来实现这个功能。 最基本的初始化代码如下： import BScroll from 'better-scroll' let wrapper = document.querySelector('.wrapper') let scroll = new...
better-scroll使用的简易demo
weixin_44294658的博客
07-05 858
个人感觉better-scroll用于移动的端的上拉加载和下拉刷新体验真的非常流畅，用于混合App开发非常合适。废话不多说，直接上demo。 <template> <template> <div class="wrapper" ref="wrapper"> <div> <slot></...
解决better-scroll下拉加载更多后，自动滚动到顶部的问题
weixin_48008551的博客
03-23 1251
当监听数据更新后，再次触发初始化，页面列表自动滚动到顶部，要想保持原位置，禁止当前滚动即可。 这里只会这个方法，如果有更好的方法，欢迎解答。 官方文档里有stop方法 stop() 参数：无 返回值：无 作用：立即停止当前运行的滚动动画。 init() { this.listScroll =new BScroll('.wrapper',{ probeType: 3, startY:true, c
better-scroll 在ios下，滑动过快时触发回弹(看到滑动之后，又弹回原处再次滑动)
前端切图仔的日常
08-10 1340
问题出现背景： 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每次上拉刷新后回到顶部的解决方案
qq_43638621的博客
03-21 4520
关于better-scroll每次上拉刷新后回到顶部的解决方案 相信很多朋友在使用better-scroll插件的时候，好不容易配置好后，在使用上拉刷新功能的时候，会遇到这个很让人头疼的问题，每次刷新后都回到顶部，又得往下翻，体验度极地，我也是遇到这个问题，百度了一下网上没有这个解决方案，就自己琢磨了一下，想到极其简单的解决方案，不喜吻喷 let self = this;//改变this...
better-scroll快速滑动，出现异常回弹
阑珊伊人
06-03 2497
原因： better-scroll在IOS 13.4版本上快速滑动，回出现异常回弹效果。这是由于IOS版本导致的。 解决办法： 在BS初始化时，加上useTransition:false github相关issues: iOS 13.4 下 bounce 存在异常
实现一个返回顶部的按钮功能（基于better-scroll实现）
weixin_57399180的博客
06-17 493
better-scroll:是一款重点解决移动端（已支持 PC）各种滚动场景需求的插件。 gitHub地址：https://github.com/ustbhuangyi/better-scroll 中文文档：
解决vue-music中better-scroll轮播图自动轮播故障
"在vue-music项目中，使用最新版better-scroll时，轮播图（slider组件）无法自动轮播的问题及解决方案" 在Vue.js开发的音乐应用vue-music中，集成better-scroll滚动库来实现页面的平滑滚动效果是常见的做法。然而，...
better-scorll 横向滚动无效
ActionPig 的 Js
06-16 976
高仿饿了么项目中用到了很多better-scroll插件，基本上都是垂直滚动。 有几个点必须要注意，一个是外部包装器wrapper通过ref="",命名后在创建BScroll实例时作为参数传入并添加其他参数。 this.scroll = new BScroll(this.$refs.yourWrapper,{其他配置参数}); 这里也有两个点需要注意，一个是内部容器只能是独立的div或者其他元素，...
使用better-scroll在vue.js中实现上拉加载与下拉刷新
"本文主要介绍了如何在Vue.js移动端应用中实现上拉加载和下拉刷新功能，使用了better-scroll库的新版本1.2.6。文章指出，由于屏幕适配问题，不同设备可能需要调整触发阈值，为此，可以从淘宝flexible.js库中获取设备...
Vue.js移动端上拉加载与下拉刷新实战：兼容多屏与better-scroll升级
文章提到使用的是Better Scroll库来实现，因为其已更新至1.2.6版本，提供了更多的便捷API。 在实现过程中，作者首先确保了基础样式，并引入了Better Scroll库。核心步骤包括在`mounted`生命周期钩子中实例化`better...
better-scroll在最新的ios13.4版本上页面回弹异常
weixin_45115895的博客
05-18 670
最近的一个vue项目,客户提出在滑动到底部或顶部过快,会出现页面回弹,刚开始我以为是我自己哪里设置有问题,后来测试发现是ios版本问题 在ios刚升级的13.4版本上滑动到底部或顶部过快,就会出现页面回弹,首先想到在BS初始化时设置了禁止回弹:bounce:fasle,结果确实不回弹了,但是到底部或者顶部时整个页面会突然的闪一下,所以此路不通 后来问了同事,说在git上有个issue #978 就是关于这个问题的讨论,然后我就去找了一下,链接如下:https://github.com/ustbhuangyi
better-scroll 踩坑
NINI_stu的博客
03-19 394
better-scroll 踩坑合集 better-scroll 失效 根据 better-scroll 的实现原理，子元素应当比给 BS 的父元素大； better-scroll 只会对第一个子元素有效，因此一般给使用的元素包裹一层父元素； 无法响应鼠标滚轮滚动 better-scroll 无法点击，只需在创建时配置 click 为 true； better-scroll 无法实现内容滚...
当 better-scroll 遇见 Vue
weixin_33812433的博客
06-01 4040
作者：滴滴公共前端 黄轶 在我们日常的移动端项目开发中，处理滚动列表是再常见不过的需求了。 以滴滴为例，可以是这样竖向滚动的列表，如图所示： 竖向列表 也可以是横向滚动的导航栏，如图所示： 横向列表 可以打开“微信 —&gt; 钱包—&gt;滴滴出行”体验效果。 我们在实现这类滚动功能的时候，会用到我写的第三方库，better-scroll。 什么是 better-scroll better-...
关闭better-scroll滚动到最底部或者顶部的弹性效果
weixin_43756060的博客
02-21 8437
添加bounce: false就可以了 mounted () { this.scroll = new BScroll(this.$refs.wrapper, { probeType: 3, click: true, bounce: false }) }
vue中使用better-scroll实现滑动以及左右联动效果
mm_hello11的博客
04-05 7688
一、首先需要在项目中引入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、付费专栏及课程。

余额充值