VUE-音楽スライダコンポーネントカルーセルことができないプロジェクトやその他の問題

音楽アプリムークラスのネットワークでvue.js上級コースを探していたとき、我々は理由VUE-cliの2は、ソースコードが輝いている場合は、小さな多くの問題があるでしょう、なぜなら、更新されたバージョンでも良く、スクロール、3に変更されたことがわかりました

構造の1建設

プロジェクトの乗車フレームワークは、VUE-CLI3以来、彼は、などバベル、スタイラスを、選択した善意を構築するために、最後のであれば場合は、ローダーを関連教育ビデオに従うか、プラグインをインストールする必要はありません。

これは、場合に応じて、盲目的に教師がインストールされているものをフォローしていない、自分の状況に基づいていなければなりません

スライダーアセンブリを書くとき2.小さな問題の多くを見つける、カルーセルことができないなど、currentPageIndex値は、更新のバージョンが多くの小さな細部が変更されている見つけたので、間違っています

以下のような：ループ初期化は、pageIndexパラメータは、ポーリング+ 1を必要としない、this.slider.goToPage（））（this.slider.nextに置き換えてもよい、クリック：偽の時間を、タグ等、実際にはないジャンプ

以下は、関連するコードです：

    _setSliderWidth（isResize）{ 
                。this.children =この$ refs.sliderGroup.childrenは

                幅= 0せ
                。sliderWidth =この$ refs.slider.clientWidthせ
                {（; iがthis.children.lengthを<I ++は、I = 0を聞かせて）ために
                    せ子= this.children [I] 
                    addClass（子、 'スライダー項目'）

                    child.style.width = sliderWidth + 'ピクセル' 
                    幅+ = sliderWidth 
                } 
                IF（this.loop &&！isResize）{ 
                    幅+ = 2 * sliderWidth 
                } 
                この。$ refs.sliderGroup.style.width =幅+ 'PX'
            }、
            _initDots（）{ 
                this.dots =新しいアレイ（this.children.length）
            }、
            _initSlider（）{ 
                this.slider =新しいBScroll（この$のrefs.slider、{。
                    scrollX：真、
                    scrollY：偽、
                    運動量：偽、
                    スナップ：{ 
                        ループ：this.loop、
                        しきい値：0.3 
                    }、
                    クリック：真
                }）
                this.slider.on（ 'scrollEnd'は、（）=> { 
                    pageIndexパラメータ= this.slider.getCurrentPage（）させpageX。
                    this.currentPageIndex = pageIndexパラメータ

                    IF（this.autoPlay）{ 
                        てclearTimeout（this.timer）
                        this._play（）
                    } 
                }）
            }、
            _play（）{ 
                this.timer =のsetTimeout（（）=> { 
                    this.slider.next（） ; 
                }、this.interval）
            }