使用better-scroll，没有出现滚动条

Question

在js中这样使用：

 created() {
       this.getBanks();
    },

methods: {
/**
         * 获取银行列表
         */
        getBanks() {
            this.service.refundBanks({
                orderId: this.orderId,
            }).then(result => {
                if (result.success) {
                    this.bankList = result.data;
                    // this.$root.bankList = result.data;
                    this.$nextTick(() => {
                        this._initScroll();
                    });
                }
            });
            this.showFlag = true;
        },
        _initScroll () {
            console.log(this.$refs.bankBox);
            this.bankBoxScroll = new BScroll(this.$refs.bankBox, {
                scrollbar: true
            });
        },
}

html内容如下：
 <div class="container" ref="bankBox">
                    <div class="content">
                        <h3 v-show="hotBanks.length > 0">Bank yang paling sering digunakan</h3>
                        <ul v-show="hotBanks.length > 0">
                            <li v-for="hotItem in hotBanks" @mousedown="handleSelectBank(hotItem)">{{ hotItem.bankName }}</li>
                        </ul>
                        <h3 v-show="normalBanks.length > 0">Bank Lain</h3>
                        <ul v-show="normalBanks.length > 0">
                            <li v-for="normalItem in normalBanks" @mousedown="handleSelectBank(normalItem)">{{ normalItem.bankName }}</li>
                        </ul>
                        <!--没有搜索结果-->
                        <p class="no-result" v-show="hotBanks.length === 0 && normalBanks.length === 0">Sorry,results connot be found</p>
                    </div>
                </div>

请问为什么没有出现滚动条？

Answer 1

设置<div class="content">的宽度大于<div class="container" ref="bankBox">的宽度