vueシームレススクロールホイールscroll

必要なのはシームレスにスクロールするリストを作ることです.この苦労してプラグインvue-seamless-scrollを見つけました.やはり記録しなければなりません.そうしないと、今度また探すかもしれません.
1.インストール

npm run vue-seamless-scroll --save

2.構成
2.1グローバル構成
メールでjsで、構成

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

3.使用
当時はこれを見つけましたが、まだいくつかの構成がよく分かりませんでした.その後、npmで検索して、ドキュメントを見て関連するパラメータの構成を見つけました.
3.1パラメータ構成
key
description
default
val
step
スクロール速度が速いほど速くなります
1
Number
limitMoveNum
シームレススクロール開始最小データ長
5
Number
hoverStop
マウスhoverコントロールを有効にするかどうか
true
Boolean
direction
方向0下1上2左3右
1
Number
openTouch
移動端オープンtouchスライド
true
Boolean
singleHeight
単一停止高さ(既定はゼロシームレス)=>方向0/1
0
Number
singleWidth
単一ステップモーション停止の幅(既定値0はシームレスに停止しないスクロール)direction=>2/3
0
Number
waitTime
単一ステップ停止待ち時間(デフォルト1000 ms)
1000
Number
switchOffset
左右切替ボタン距離左右境界のエッジ(px)
30
Number
autoPlay
自動再生スイッチはfalseに設定する必要がありますか?
true
Boolean
switchSingleStep
手動単一ステップ切替step値(px)
134
Number
switchDelay
単一ステップ切り替えのアニメーション時間(ms)
400
String
switchDisabledClass
ステータスのswitchボタン親要素のクラス名をクリックできません
disabled
String
isSingleRemUnit
singleHeight and singleWidth remメトリックを開くかどうか
false
Boolean
3.2使用

  

        

                  
        
   


  computed: {
    classOption () {
      return {
        singleHeight: 57,
        waitTime: 2000,
        step: 0.5,
        hoverStop: false 
      }
    }
  },

OK、基本的には中身が入っていません.会社の业务コードは、以下に効果図(声明:データはすべて自分で模拟したmockデータで、会社のデータとは何の関系もありません)[外链画像の転送に失败しました.ソースステーションには防犯チェーンのメカニズムがある可能性があります.画像を保存して直接アップロードすることをお勧めします(img-I 4 ROOONy-1589183509373)(https://upload-images.jianshu.io/upload_images/11611010-6860276b01ca8109.png?imageMogr2/auto-orient/strip%7 CimageView 2/2/w/1240)[[外部チェーン画像の転送に失敗した場合、ソース局は盗難防止チェーン機構がある可能性があり、画像を保存して直接アップロードすることを提案する(img-ExFRHXZB-1589183509375)](https://upload-images.jianshu.io/upload_images/11611010-bca3347639e09109.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)]
gif図ができなくて、仕方なく1枚目がスクロール中で、2枚目は正常な図で、みんなの効果が実現すればokで、図は合わせて見ればいいです.