1、安裝better-scroll

npm install--save better-scroll

2、在組價中引用

import BScroll from 'better-scroll'

3、建立滾動

new BScroll(Dom元素)

這裡的Dom元素可以傳一個類選擇器，比如：

new BScroll('.shop-info'，{
    click:true,//啟用點選，因為better-scroll會預設禁用掉元素的點選事件
})

注意：Vue中資料更新是非同步的，在資料還沒有載入完之前，BScroll是無法獲取目標內容容器的高度的，就會出現無法滾動的現象。 這裡可以用$nextTick()解決。

this.$store.dispatch('getShopRatings',()=>{
    this.$nextTick(()=>{
        new BScroll('.shop-info',{
            click:true
        })
    })
})

4、設定橫向滾動

滾動預設是縱向滾動的，實現橫向滾動就要設定scrollX屬性，如下：

new BScroll('.shop-info'，{
    click:true,//啟用點選，因為better-scroll會預設禁用掉元素的點選事件
    scrollX:true //橫向滑動
})
 

注意：實現滾動的條件

內層div高度一定大於外層div的寬或高，才能滾動