使用better-scroll无法实现滑动

最新推荐文章于 2021-12-05 22:18:05 发布
最新推荐文章于 2021-12-05 22:18:05 发布
阅读量106 收藏
点赞数
分类专栏： vue 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_47922373/article/details/116978867
版权

（学习的一点记录）

在代码没有报错的情况下，因为版本问题可能导致better-scroll没有生效，那么可以添加

observeDOM:true

在这里插入图片描述

鸭鸭很可爱
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
better-scroll无法滚动
pullgo的博客
01-19 896
总结一下目前为止碰到的better-scroll无法滚动的问题。 12遇见better-scroll(以下简称：BS)无法滚动，可从两方面去考虑。 一是层级关系出错，二是计算高度出错。1，层级关系BS的基本结构是：一个wrapper层，一个content层。wrapper层是整个滚动页面占据的显示空间。content层则包含了全部的页面内容。div class="wrapper"> div
关于使用better-scroll滑动无法滚动的技术总结
baidu_41677887的博客
09-23 2974
这个问题是我在编辑商城的遇到的问题，着实让我查找了好多资料 问题描述：使用better-scroll插件的时候，页面无法滚动 问题发生原因：最开始使用的better-scroll时候，对于普通的文档滑动完全没问题，但是我对起封装了一层代码， <template> <div class="wrapper" ref='wrapper'> <div class="content"> <slot></slot> </div>
如何使用better-scroll以及遇到滑动失效等问题（vue）
weixin_57286220的博客
12-03 2225
当我们在移动端上进行触控滑动的时候，明明代码写的没有什么问题，但就是滑动十分的不流畅，用了很多css样式和数据优化都改变不大，于是在尝试用better scroll了之后，解决了这个问题。 但在第一次尝试使用的时候，遇到了引入了better scroll，但就是页面组件里不滑动。（我使用的是在页面中单个组件滑动） 总结了一下，有一下几点在使用的时候需要注意的地方： 1:首先就是在需要滑动的组件中引入（先npm下好组件） import BScroll from "better-scroll"; 2:一定要在
better-scroll不能滚动问题
Pure_wu的博客
01-01 1923
跨年夜：2021年1月1日 01:22：23 星期五 解决bug：better-scroll不能滚动问题。 首先给出图 这个项目是在网上找的视频看的，就照着写了，网上的视频是有接口的，但是我看的时候接口不能用，它告诉我 算了，求人不如求己，我还是自己来吧，想了半天，我还是自己mock数据吧，于是 ----> 扒了600多行的json，恩，接口总算通了。渲染完毕以后就有了上第一个图片。 接下来是重点了，第一个图片虽然渲染的没问题，但是，它不能滚动，我用的是better-scroll插件，我仔仔细
Better-Scroll代码正确却无法滑动的小bug解决方案
Heby的博客
07-01 634
better-scroll插件大多数用于移动端上拉加载更多和下拉更新，根据官网说明时需要两个div框，来使用scroll。但是Better-Scroll在决定有多少区域可以滚动时, 是根据scrollerHeight属性决定，scrollerHeight属性是根据放Better-Scroll的content中的子组件的高度，这样就会面临一个很尴尬的问题，因为我们的数据是调取来的，并没有固定的值，并且在执行上拉加载更多时候，高度更是无法估量，因此会造成超出高度部分无法滑动的。以下是我面临该问题...
使用了better-scroll 却无法滚动问题
qq_54007297的博客
12-05 946
一、better-scroll版本不合适-----之前使用的是2.x版本 1：卸载已安装的版本 npm uninstall better-scroll 2：安装新版本 npm install better-scroll@1.8.1 --save 二、子元素内容小于父元素 绿色部分为 wrapper，也就是父容器，它会有固定的高度。黄色部分为 content，它是父容器的第一个子元素且唯一一个，它的高度会随着内容的大小而撑高。那么，当 content 的高度不超过父容器的高度，是.
better-scroll无法滚动的问题
热门推荐
OHRadiance的专栏
11-11 1万+
总结一下目前为止碰到的better-scroll无法滚动的问题。 遇见better-scroll(以下简称：BS)无法滚动，可从两方面去考虑。 一是层级关系出错，二是计算高度出错。1，层级关系BS的基本结构是：一个wrapper曾，一个content层。wrapper层是整个滚动页面占据的显示空间。content层则包含了全部的页面内容。<div class="wrapper"> <div
vue使用better-scroll实现滑动以及左右联动
10-15
在Vue.js应用中，我们可以利用Better Scroll库来实现滑动效果和左右联动功能。Better Scroll是一个强大的滚动插件，能够提供类似原生滚动的流畅体验，尤其适合移动端应用。以下是对如何在Vue项目中集成和使用Better ...
vue中使用better-scroll实现滑动效果及注意事项
10-17
本文将详细介绍如何在Vue中使用`better-scroll`以及在实现过程中需要注意的关键点。 首先，要在项目中引入`better-scroll`，你需要在`package.json`文件中添加依赖，例如："better-scroll": "^1.11.1"，然后执行`...
vue2.0 better-scroll 实现移动端滑动的示例代码
08-28
本文主要介绍了使用 Vue2.0 和 Better-Scroll 实现移动端滑动的示例代码，着重于左右联动效果的实现方法。 Better-Scroll 介绍 Better-Scroll 是一个 JavaScript 库，用于实现移动端滑动效果。它提供了多种滑动...
Vue + better-scroll 实现移动端字母索引导航功能
08-27
在使用 better-scroll 时，需要注意probeType 的设置，probeType 为 3 时，不仅在屏幕滑动的过程中，而且在 momentum 滚动动画运行过程中实时派发 scroll 事件。如果没有设置该值，其默认值为 0，即不派发 scroll ...
better-scroll滚动不了的问题
Seety_ST的专栏
09-08 7531
今天有空尝试用了better-scroll组件来写slider，谁知道遇到一个很坑的一个东西。1、一定要每个slider-item元素添加一个宽度，重点是父元素slider-group的宽度也一定要大于等于所有子元素slider-item之和。2、一定要保证在DOM渲染完毕后初始化better-scroll，也就是添加延时执行，setTimeout(() => { this._in
使用better-scroll时滑不动？看看是不是这个问题
纸月四的博客
12-11 859
首先看wrapperHeight的高度和内容的高度是什么？ 要满足 内容高度大于容器高度。 hasVerticalScroll为true。 scrollerHeight的高度要等于 wrapperHeight-contentHeight。 一般是没有设置容器的高度或这内容高度不够。 如果 内容高度大于容器高度，但是 hasVerticalScroll为false。 scrollerHeight高度等于了wrapperHeight的高度。 如果数据是异步获取的，这时应该把数据传给 scroll组件，
关于better-scroll 小问题
wcq_work1995的博客
05-31 5630
今天在用黄毅老师的better-scorll插件的时候碰到一个小问题，发现页面无法上下滚动，我花了一点时间去翻阅了api和审查绑定元素，发现代码应该没问题，然后我在控制台输出了绑定的scroll对象 眼睛直接扫到了hasVerticalScroll这个key，哈哈，这不是‘是否有垂直滚动’的键吗，于是我在浏览器端直接将‘false’改成了‘true’，果然可以直接滚动，但是只能拖拽（因为高度不
解决 better-scroll插件使用过程中无法滑动bug（原创，禁止转载）
zqy123456789000的博客
11-22 1577
解决 better-scroll插件使用过程中无法滑动bug 1：首先我们要知道 better-scroll 实现的原理 条件 必须包含两个大的div，外层和内层div 外层div设置可视的大小(宽或者高)-有限制宽或高 内层div，包裹整个可以滚动的部分 内层div(content)高度一定大于外层div(wrapper)的宽或高，才能滚动 翻译：Warpper（包装，包装器) content(内容) 顾名思义，Wrapper 就是外层的盒子，content 就是你需要滑动区域里的内容 也就是，你想要使
better-scroll滚动无效 几种原因
WEB木易
08-22 2754
better-scroll滚动无效 几种原因 1.是否设置初始化 2.是否父元素设置了高度大于父元素 父元素可以设置100%， 3.DOM的的层级是否正确 &lt;div class="wrapper"&gt; &lt;div class="content"&gt; content... &lt;/div&gt; &lt;/div&gt; 上面这种方式是可以实...
解决Vue滑动插件Better-Scroll，卡顿，划不动的bug
weixin_45020094的博客
06-16 3464
bug原因： 因为Better-Scroll插件需要计算滑动的高度，如果页面图片较多，图片没有加载完成，滑动高度就已经计算出来，这个数据偏小，网速较快不会出现这个bu 解决方法： 每个图片加载完毕后，都让他重新计算滑动高度，最后算出来的高度就正确了 代码 使用 @load监听img标签 这样每次图片加载完毕，就会调用这个方法 <img :src="goodsItem.show.img" alt="" @load="imageLoad"> 获取到better-scroll的组件，
better-scroll解决滑动问题
朽木自雕的博客
12-04 3034
1、使用better-scroll时出现的问题 当使用better-scroll时，会出现如下情况： 用鼠标拖动时拖不动，使用滚轮可以滑动，但是上面的标题和tab栏都会滑动（这是我们不想要的结果） 2、分析原因 此时scrollerHeight =wrapperHeight，而能够滚动的必要条件就是，scrollerHeight >wrapperHeight 。 3、解...
better-scroll选项卡
最新发布
09-17
根据引用内容，我了解到你使用了better-scroll库来实现效果。首先，你提到了使用scrollStart事件来实现下滑隐藏，然后使用scroll事件来实现上移显示。这样可以在滑动开始时隐藏底部导航栏，在滑动结束时显示出来。...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值