分类：better-scroll

2021
10-15

vue开发移动端使用better-scroll时click事件失效的解决方案

最近使用vue学习开发移动端的项目，使用了better-scroll插件做滚动。在引入better-scroll的组件中使用@click事件的时候，点击事件失效，v-on:click、v-bind:click、@click.native都不行，试了一下@touchstart是却是可以的，发现better-scroll的配置中没有设置click：true，设置过之后click事件成功。后来在使用vuex的时候一直报[vuex]unknownmutationtype:changeCity才发现在store文件中将mutations写在了state里面，被自己蠢... 继续阅读 >

2021
08-06

vue使用better-scroll实现横向滚动的方法实例

一、滚动的实现原理better-scroll的滚动原理和浏览器原生滚动原理是一样的，当子盒子的高度大于父盒子的高度，就会出现纵向滚动；同理，如果子盒子的宽度大于父盒子的宽度，那么就会出现横向滚动。二、better-scroll的html结构先来看一下better-scroll常见的html结构：<divclass="wrapper"><ulclass="content"><li>...</li><li>...</li>...</ul></div>BetterScroll应用于外部wrapper容器，并且滚动部分是c... 继续阅读 >

2020
09-24

Vue中使用better-scroll实现轮播图组件

better-scroll是什么better-scroll是一款重点解决移动端（已支持PC）各种滚动场景需求的插件。它的核心是借鉴的iscroll的实现，它的API设计基本兼容iscroll，在iscroll的基础上又扩展了一些feature以及做了一些性能优化。better-scroll是基于原生JS实现的，不依赖任何框架。它编译后的代码大小是63kb，压缩后是35kb，gzip后仅有9kb，是一款非常轻量的JSlib。今天我们利用它实现一个横向滚动——轮播图组件。... 继续阅读 >