vue无缝滚动列表插件vue-seamless-scroll使用|vue无缝滚动列表实现

    cnpm install vue-seamless-scroll --save

    import Scroll from 'vue-seamless-scroll'
    
    components:{
    Scroll 
    }
    
    data(){
    	return{
    		 scrollData:{ // 插件配置 ps：注意 limitMoveNum 开始无缝滚动的数据量、step 数值越大速度滚动越快、
    	        step: 0.5, // 数值越大速度滚动越快
    	        limitMoveNum: 10, // 开始无缝滚动的数据量
    	        hoverStop: true, // 是否开启鼠标悬停stop
    	        direction: 1, // 0向下 1向上 2向左 3向右
    	        openWatch: true, // 开启数据实时监控刷新dom
    	        singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
    	        singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
    	        waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
    	      },
    	      scrollDataList:[
    	        {itemname:'1-'},
    	        {itemname:'2-'},
    	        {itemname:'3-'},
    	        {itemname:'4-'},
    	        {itemname:'5-'},
    	        {itemname:'6-'},
    	        {itemname:'7-'},
    	        {itemname:'8-'},
    	        {itemname:'9-'},
    	        {itemname:'10-'},
    	        {itemname:'11-'},
    	        {itemname:'12-'},
    	      ],
    	}
    }

    <Scroll  :data="scrollDataList" class="seamless-warp" :class-option="scrollData">
    <div  v-for="(item,index) in scrollDataList" :key="index" >
        <div >{{item.itemname}}</div>
    </div>
    </Scroll >