关于better-scroll失效的问题

最新推荐文章于 2022-08-20 15:48:16 发布

Zhihaot1

最新推荐文章于 2022-08-20 15:48:16 发布

阅读量798

点赞数

分类专栏：问题记录文章标签： javascript vue.js

本文链接：https://blog.csdn.net/qq_43429800/article/details/117371755

版权

关于better-scroll失效的问题

最近在开发中，想要实现图片横向滚动的效果，用到了better-scroll插件，官方网址还是一如既往打不开，看不到其中的API接口和相应的说明，于是在使用插件过程中经常出现滚动失效。在这里就想记录一下bug的产生原因和解决方法。

横向滚动

this.scroll = new BScroll(wrapper, {
   
	scrollX: true,  //开启横向滚动
	scrollY: false,  //关闭纵向滚动
	eventPassT

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Zhihaot1

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

在vue中封装一个betterscroll组件，并解决ios、Android在微信页面上下拉出现滑动的问题

前端李小白的博客

03-31

2988

最近在开发微信公众号网页的时候，发现使用原生滚动的时候，ios在微信网页下，上拉，下拉都会出现一大片的空白，看起来极其的别扭，为了解决这一问题，找了许多参考资料，如下是解决方法。 1.首先在你需要禁止滑动的页面中添加如下代码 mounted（）{ document.body.addEventListener( 'touchmove', function (e)...

Better-scroll导致的吸顶效果失效解决方案

weixin_46567428的博客

01-30

1028

Better-scroll导致的吸顶效果失效解决方案问题背景：在supermall项目中为优化商品展示滚动性能，引入better-scroll框架，由于一些不太清楚better-scroll底层实现，导致tabControl.vue的吸顶样式失效。原本设置的吸顶样式：(已失效) position:sticky top:44px; left:0; right:0; 为了恢复这种效果，可采用狸猫换太子的办法。问题解决思路：狸猫换太子原样式可删掉（吸顶效果那部分）在组件产生吸顶效果的地方复制

参与评论您还未登录，请先登录后发表或查看评论

better-scroll滚动无效几种原因

qq_36059306的博客

07-31

810

https://blog.csdn.net/qiqi_77_/article/details/79361413

用better-scroll滚动失效的原因之一

qq_31150171的博客

06-10

2006

在vue中v-show的元素使用better-scroll滚动失效的原因在你添加better-scroll的组件中使用如下操作<script> import Bscroll from 'better-scroll' export default { name: 'MenuCart', computed: { myValue () { return this....

better-scroll笔记

lyy_fighting的博客

01-09

674

better-scroll 来源：https://github.com/ustbhuangyi/better-scroll 使用说明：https://better-scroll.github.io/docs/en-US/ 操作案例（学习coderwhy的vue框架ing）演示代码在src/views/category/Category.vue 1.安装框架 1）npm install better-scroll --save 弹幕大佬说新版本很多bug，所以跟着老师安装的版本即可 npm install

关于使用better-scroll滑动无法滚动的技术总结

baidu_41677887的博客

09-23

3073

这个问题是我在编辑商城的遇到的问题，着实让我查找了好多资料问题描述：使用better-scroll插件的时候，页面无法滚动问题发生原因：最开始使用的better-scroll时候，对于普通的文档滑动完全没问题，但是我对起封装了一层代码， <template> <div class="wrapper" ref='wrapper'> <div class="content"> <slot></slot> </div>

(2021通过插件解决)better-scroll插件的无法滑动bug

王光迪的CSDN

02-27

4130

2021-2-27日，这是一篇绝对可以解决问题的文章

解决better-scroll滚动无效问题

JaneChelle

10-25

789

昨天在写一个移动端的横向滚动，引入cube-ui的cube-scroll，硬是不出来效果，后来还是自己的css有问题。要想引入得经过以下几个步骤：一、安装cube-ui npm install cube-ui --save 修改 package.json 并安装依赖： ... "scripts": { "dev": "webpack-dev-server --inli...

vue使用 better-scroll的参数和方法

weixin_34310785的博客

11-09

320

格式：var obj = new BScroll(object,{[option1,],.,.});注意：1、要确保object元素的高度比其父元素高2、使用时，一定要确保object所在的dom渲染后，再用上面的语句，或者obj.refresh() Options 参数startX: 0 开始的X轴位置startY: 0 开始的Y轴位置scrollY: true 滚动方向为 Y 轴scrollX...

better-scroll一会儿有效，一会儿无效

bbgdragonvipcmy的博客

08-20

315

解决better-scroll初始化异常问题

vue中使用better-scroll实现横向滚动不生效

感恩、奋进、自信

05-07

6996

vue中实现横向滚动不生效，如下图红圈中所示：红圈中的html在seller.vue中的<template>内容如下<div class="pics"> <h1 class="title">商家实景</h1>  &

better-scroll 在vue中使用on监听事件，事件无效问题解决

czz0724的博客

04-26

1364

解决方法看下面你可能是对象放错地方了明明都有属性了为何就是不行不应该是这样才对么还有现在监听了pullingUp 却又报错better-scroll.esm.js?f40f:180 [BScroll warn]: EventEmitter has used unknown event type: "pullingUp", should be oneof ["refresh","contentChanged","enable","disable","beforeScrol

解决better-scroll横向滚动无效果问题

CSDN for recording problems

07-21

464

官方建议，给父元素添加固定宽度才可以滚动，第一种方案获取每一个元素的宽度，ele.offsetWidth，并累加起来，最后给父元素添加 ele.style.width = '累计的宽度' 第二种方案建议直接使用这一种方案，可以不需要计算各个子元素的所占的宽度父元素： display: inline-block; white-space: nowrap; 子元素： display: inline-block; 直接可以滚动了~。 ...

better-scroll滚动失效的原因

m0_50853469的博客

05-31

1357

1.wrapper只能有一个div。 2.打印下scroll，看下wrapper和scroller里边的东西，在审查元素，看下scroller是否含有better-scroll的样式。 3.看下里边的wrapperHeight<scrollHeight，还有hasVerticalScroll是否为true。 4.如果上面条件都满足，还不能滚动，那就是没有写click的配置项。 ...

better-scroll 失效问题与求助

qq_52753587的博客

12-16

992

在使用better-scroll的时候，我将他封装成了一个组件，然后直接在项目中使用，代码如下：但出现了滚动失效的bug。 <template> <div class="wrapper" ref="wrapper"> <div class="content"> <slot></slot> </div> </div> </template> <scroll>&

better scroll与flex联用在ios 10下无法滑动的问题

黄治文的博客

05-21

515

better scroll与flex联用在ios 10下无法滑动的问题上图使用的betterscroll做下拉刷新，中间部分中flex:1自适应高度，做betterscroll的壳子，然而在ios10上，居然滚动不了。该问题归决于容器高度获取有误，最终解决方法为：改用calc来获取高度。 .pagecontent{ flex: 1; position: absolute; overflow:hidden; wid

5.16 BScroll页面切换滑动失效，点击事件冒泡（未绑定click也会监听click)，transition-group动画特例，BScroll未激活不允许任何事件调用，类的实例和对象

qq_40196738的博客

05-17

752

1、当遇到切换页面导致BScroll滑动失效时。多半是因为dom的重新渲染导致，BScroll的滑动高度为0。或者组件v-show从false->true，而BScroll未计算高度导致。最好的办法就是设置侦听器，对前后改变的数值进行侦听，并因此刷新betterScroll组件。 2、点击事件冒泡问题。情况一：比如蒙层设定了@click=“hide”，但是当点击子层的任何位置，均会触...