我院新闻
vue大屏开发系列—列表无缝滚动之vue-seamless-scroll
发布时间:2024-02-26

目录

一 安装

二 使用

 三 简单使用

四  应用


vue-seamless-scroll是一个基于Vue.js的简单无缝滚动组件, 基于requestAnimationFrame实现,配置多满足多样需求。目前支持上下左右无缝滚动,单步滚动,以及支持水平方向的手动切换功能

官方文档:  vue-seamless-scroll的简介及使用教程 - Made with Vuejs

一 安装

npm安装 : 

npm install vue-seamless-scroll --save

yarn 安装:

yarn add vue-seamless-scroll


二 使用

全局注册:

import Vue from 'vue'
import scroll from 'vue-seamless-scroll'
Vue.use(scroll)


局部注册:

 注意这里分vue2和veu3注册

vue2:  

import vueSeamless from 'vue-seamless-scroll'


vue3;找不到路径所以加了 /src

import vueSeamless from 'vue-seamless-scroll/src'

components: { vueSeamless },

 三 简单使用

四  应用

本文是在“物美智能”源码的基础上进行二次开发完成wumei-smart: 物美智能开源物联网平台,简单易用,可用于搭建物联网平台以及二次开发和学习。适用于智能家居、智慧办公、智慧社区、农业监测、水利监测、工业控制等。

也可以直接在lofTV-Screen代码上直接修改[返回上级]