大屏项目经常遇到列表自动滚动的场景,于是撸了个vue2的组件,滚动的原理是定时改变容器的scrollTop值。 列表内容是通过slot插入的,看一下效果。 滚动效果 使用 npm install -save vue-list-auto-scroll-tsc 引入后注册为组件即可使用 属性 step: 类型: String, Number 默认:1 说明:每次滚动的距离
import scroll from 'vue-infinite-auto-scroll' Vue.use(scroll) // 或者你可以自己设置全局注册的组件名 默认注册的组件名是 vue-infinite-auto-scroll Vue.use(scroll,{componentName: 'vue-infinite-auto-scroll'}) // 2.单个.vue文件局部注册 import vueInfiniteAutoScroll from 'vue-infinite-auto-scroll...
isRoller 是否可以使用滚轮滚动 boolean true,false rollerScrollDistance 滚轮滚动的速率 number (isRoller 必须为 true)为正数即可 data 接收异步数据 array 同步任务可不传 注: 当scrollDirection 为top或bottom时,一定要为 vue-auto-scroll 组件设置高度。 当scrollDirection 为left或right时,一定要为 vue-auto-sc...
8Branches4Tags Code vue-infinite-auto-scroll 基于vue.js的无缝自动滚动的插件,可添加无限数据而不卡顿 内容 浏览器兼容性 功能特性 安装 使用 案例 配置项默认值 个别特殊配置项说明 历史版本 注意 贡献 浏览器兼容性 IE Firefox Chrome Safari iOS
A free, fast, and reliable CDN for vue3-auto-scroll. a auth scroll component with vue3, support typescript
可以使用 CSS 的 overflow 属性实现 scroll 滚动，如下所示：<!-- 这里放置需要滚动的内容 --> 在这...
.test-auto-scroll { position: relative; overflow: hidden; height: calc(100% -12px); .event-block { text-indent: 2em; font-size: 12px; color: #FFFFFF; letter-spacing: 0; text-align: justify; word-break:break-all; padding: 5px0; border-bottom...
use(VScroll) 使用组件 代码语言:javascript 代码运行次数:0 运行 AI代码解释 <!-- 原生滚动条 --> <v-scroll native> 这里是自定义内容。这里是自定义内容。这里是自定义内容。 </v-scroll> <!-- 自定义参数配置 --> <v-scroll autohide size="15" color="#00a1e0" zIndex="8080"> 这里是...
如果在Vue应用中需要实现上下滚动,可以通过使用CSS样式和DOM操作来实现。可以给容器元素设置固定的高度和overflow属性为auto或scroll,这样就可以在内容超出容器时出现垂直滚动条。 在Vue中,可以利用v-bind指令绑定样式和属性,通过动态修改这些属性来控制滚动行为。可以根据需要设置容器元素的高度、滚动条的样式、滚动条的位...
vue3.0-scroll一款基于vue3.x开发的pc桌面端虚拟滚动条组件。拥有简便的调用方式,支持自定义滚动条尺寸、颜色、层叠及是否自动隐藏滚动条等功能。 v3scroll支持水平+垂直滚动条。 配置:native="true"则会显示默认系统滚动条。 配置:autohide="true"鼠标移开则会自动隐藏滚动条。