51CTO首页
AI.x社区
博客
学堂
精品班
软考社区
免费课
企业培训
鸿蒙开发者社区
信创认证
公众号矩阵
移动端
视频课 免费课 排行榜 短视频 直播课 软考学堂
全部课程 软考 信创认证 华为认证 厂商认证 IT技术 PMP项目管理 免费题库
在线学习
文章 资源 问答 课堂 专栏 直播
51CTO
鸿蒙开发者社区
51CTO技术栈
51CTO官微
51CTO学堂
51CTO博客
CTO训练营
鸿蒙开发者社区订阅号
51CTO软考
51CTO学堂APP
51CTO学堂企业版APP
鸿蒙开发者社区视频号
51CTO软考题库
CKA（Kubernetes 管理员认证）精品班
按照企业k8s需求进行技能培训，帮助用户快速拿下CKA认证，K8S采用新版本进行授课，课程内容全、讲解详细 。 免费试学
软考高级：系统架构设计师精品班
根据考试大纲对知识点、高频考点进行深入讲解，传授答题技巧及判断标准，助力高效备考。 免费试学
信创认证：系统架构师精品班（高级）
信息技术应用创新人才考试评价 免费试学

vue2项目中better-scroll 插件使用时候页面不滚动
参考这里 1.外面包裹层的高度没有设置或者条目的高度没有超过外面包裹层的高度 2.初始化BetterScroll的时机不对,当前元素还没有正常渲染出来,导致BetterScroll的高度的计算错误
Vue
初始化
原创
mb611f1a641bd18
2021-08-20 13:47:08
226阅读

better-scroll
背景： 在移动端触发事件一般不用click 因为有延迟，一般用的是 touchstart （但是有问题，点击滑动都会触发） 所以用tap(只点击生效，滑动不生效) ，但是原生不支持 所以要用第三方的库来实现比如：zepto、vue-touch 、better-scroll（在iscroll之上再做了 ...
实例化
数据加载
ios
下载安装
移动端
转载
mob604756fbb3bd
2021-04-11 01:04:00
333阅读
2评论

better-scroll
<template> <div class="wrapper" ref="wrapper"> <div class="content"> <ul> <li v-for="i in data" :key="i" @click="abc"> {{i}} </li> </ul> <!--上拉加载--> < ...
上拉加载
下拉刷新
click事件
转载
mb5ffd6fed5661e
2021-10-20 14:12:00
137阅读
2评论

vue2 ios 中 scroll 滚动 页面白
# Vue2 IOS 中 Scroll 滚动页面白 在开发移动端应用或网页时，我们经常会遇到在 IOS 设备上使用 Vue2 框架开发的页面出现滚动时页面白屏的问题。这个问题通常是由于 IOS 设备上的滚动条样式和 Vue2 的滚动机制不兼容导致的。在本文中，我们将介绍解决这个问题的方法，并提供代码示例。 ## 问题分析 在 IOS 设备上，滚动条的样式是由系统默认控制的，而在 Vue2 中
css
解决方法
CSS
原创
mob64ca12eb7baf
2024-04-26 05:43:44
189阅读

vue2 ios 中 scroll 滚动 页面白 vue scrollbar
Vue 应该说是很火的一款前端库了，和 React 一样的高热度，今天就来用它写一个轻量的滚动条组件；知识储备：要开发滚动条组件，需要知道知识点是如何计算滚动条的大小和位置，还有一个问题是如何监听容器大小的改变，然后更新滚动条的位置；先把样式贴出来：.disable-selection { -webkit-touch-callout: none; -webkit-user-select:
vue
ci
css
Vue
转载
gulaotou
2023-08-23 20:43:47
103阅读

better-scroll在vue中的应用
在我们日常的移动端项目开发中处理滚动列表是再常见不过的需求了以滴滴为例可以是这样竖向滚动的列表如图所示微信 —> 钱包—>滴滴出行”体验效果。什么是 better-scroll better-scroll 是一个移动端滚动的解决方案它是基于 iscroll 的重写它和 iscroll 的主要区别在 这里 。better-scroll 也很强大不仅可以做普通的滚动列表
浏览器
解决方案
项目开发
原创
zddnd
2017-06-20 10:57:28
1221阅读

vue3 使用better-scroll滚动
在GitHub里搜索这个名称 然后点进去，获取下载方式，通过vue终端进行下标 下载完成在需要的Vue组件页面里引入 在视图HTML上我们要滚动的结构要使用两层div包裹，并给出相应的class 其次在js里即逻辑层 一般在vue3里我们所有的代码都是写在setup里的所以我们需要在这个页面加载完成 ...
入事件
html
当前页
搜索
页面加载
转载
mob604756eff415
2021-07-16 16:02:00
2793阅读
2评论

Vue项目中使用better-scroll
当 better-scroll 遇见 Vue在我们日常的移动端项目开发中，处理滚动列表是再常见不过的需求了。 以滴滴为例，可以是这样竖向滚动的列表，如图所示：也可以是横向滚动的导航栏，如图所示：可以打开“微信 —> 钱包—>滴滴出行”体验效果。我们在实现这类滚动功能的时候，会用到我写的第三方库，better-scroll。什么是 better-scrollbetter-scroll是一个移动端滚动的解决方案，它是基于 iscroll 的重写，它和 iscrol..
初始化
数据
滚动效果
下拉刷新
vue.js
转载
wx61133eeec1457
2021-08-12 14:53:01
630阅读

vue项目better-scroll使用注意点
1.应该在何时创建BScroll对象 1）created : 中请求数据，ajax是异步的，这个时候可能mounted已经执行完了，也就是dom挂载完了，但数据还没请求回来，无法获取到内部元素（数据渲染出来的dom）高度. 无法渲染内部元素，无法滚动2）updated:数据发生改变时执行；数据改变，
数据
数据加载
ajax
请求数据
转载
mb5ff59200ebb3c
2020-12-08 14:54:00
195阅读
2评论

better-scroll react
git https://gitee.com/mirrors/better-scroll/ 1.x 文档 https://better-scroll.github.io/docs-v1/doc/zh-hans/ 2.x文档 https://better-scroll.github.io/docs/zh ...
git
github
html
ide
转载
mob604756fe00bf
2021-08-05 13:24:00
171阅读
2评论

better-scroll快速上手及封装（vue项目）
BetterScroll 是一款重点解决移动端（已支持 PC）各种滚动场景需求的插件。它的核心是借鉴的iscroll的实现，它的 API 设计基本兼容 iscroll，在 iscroll 的基础上又扩展了一些 feature 以及做了一些性能优化。 BetterScroll 是使用纯 JavaScr... ...
默认值
性能优化
移动端
配置项
上拉加载
转载
mb5fdb13b347132
2021-10-25 16:11:00
316阅读
2评论

六、Vue中使用滚动插件：better-scroll
1.安装插件cnpm install better-scroll --save2.使用（1）是元素符合规范  要想使用 better-scroll 这个插件，必须保证元素符合下列规则：<div class="wrapper"> <ul class="content"> <li>...</li> <li>.....
实例化
安装插件
原创
mb62b19580f1ddc
2022-06-21 20:01:01
92阅读

vue中的better-scroll横向滚动案例
1.安装better-scroll 托管在 Npm 上，执行如下命令安装： npm install better-scroll --save; 2.引入 import BScroll from 'better-scroll' 如果是ES5语法 var BScroll = require('better-scroll') <template> <div class="
Vue.js
vue
原创
江一铭的博客
2021-07-12 11:04:28
977阅读

vue中的better-scroll横向滚动案例
​1.安装 better-scroll 托管在 Npm 上，执行如下命令安装：​npm install better-scroll --save;​2.引入​import BScroll from 'better-scroll'如果是ES5语法var BScroll = require('better-scroll')<template> <div class="box"&gt
vue
i++
公众号
点击事件
原创
江一铭的博客
2022-02-26 17:35:21
687阅读

better-scroll 的使用
1.安装 2.引入 3.初始化 获取这个 DOM 对象 这行代码就是来获取dom 的 链接：https://better-scroll.github.io/docs/zh-CN/plugins/#%E4%BD%BF%E7%94%A8%E6%8F%92%E4%BB%B6%E7%9A%84%E6%96%
数据
生命周期
初始化
github
mysql
转载
mb5ff591cb6ec96
2019-06-30 11:05:00
130阅读
2评论

vue2
跨域设置 http://www.ituring.com.cn/article/200275 打包 npm adduser 如果长时间不登录，可能会过期，使用 npm login 进行登录就可以 pu
其他
原创
wx60f7f54847950
2021-07-23 11:32:15
391阅读

vue2 eslint vue2 eslint版本
eslint用于代码检查，prettier用于代码格式化，具体操作如下1.安装以下eslint插件 安装以下eslint插件，并增加.eslintrc.js配置文件，.eslintignore配置忽略检查的文件（1）eslint 用于检查和标示出ECMAScript/JavaScript代码规范问题工具。 （2）@babel/eslint-parser 简而言之就是一个解析器，允许您使用ES
vue2 eslint
json
代码格式化
解析器
转载
mob64ca140caeb2
2024-05-29 12:57:59
283阅读

vue2
main.js App.vue action.js getters.js index.js mutation.js types.js
sed
Java
转载
mob604756f49b91
2017-06-24 05:50:00
220阅读

vue2
vue2
ios
github
html
拦截器
.net
原创
wx60f7f54847950
2021-08-01 18:40:40
412阅读

vue2 支持android vue2兼容
最近项目开发中遇到需要用到ie浏览器的情况，因为是内网开发，大致记录下兼容过程。问题1：ie11浏览器页面无法加载首先遇到的问题是谷歌浏览器运行无问题，控制台也不报错，但是ie11浏览器就打不开，控制台报错----显示语法错误：，了解后发现ie浏览器不支持es6，可以通过core-js/stable及regenerator-runtime/runtime编译，vue cli官方推荐使用，main.
vue2 支持android
vue.js
Vue
显式
官网
转载
轩辕
2024-04-03 14:52:36
210阅读
  • 1
  • 2
  • 3
  • 4
  • 5
精品课程领资料
免费资料>
2025软考
系统架构设计师 系统规划与管理师 软件设计师 系统集成项目管理工程师
信创认证
系统架构师 信创集成项目管理师 信创规划管理师 系统开发工程师
厂商认证
CKA/CKS架构师 红帽认证工程师 Oracle-OCP认证 Oracle-OCM认证
IT技术
数据库高级工程师 AIGC大模型实战 Linux云计算架构师 Python全栈开发
华为认证
数通HCIP认证 云计算HCIE认证 华为存储HCIE认证 HCIP安全认证
相关文章

vue项目笔记（16）-vue滚动插件better-scroll的使用

vue2 unit test 教程 vue2 jsx

vue2安装jquery vue2安装eslint

vue2 配置axios vue2 composition api

vue2安装 yarn vue2安装eslint

better-scroll 踩坑总结

better-scroll 实现无缝轮播

Vue2【插槽】

vue2 fengzhuangaxios

Copyright © 2005-2025 51CTO.COM 版权所有 京ICP证060544号

关于我们
官方博客 全部文章 热门标签 班级博客
了解我们 网站地图 意见反馈
友情链接
鸿蒙开发者社区 51CTO学堂
51CTO 软考资讯