如何自動添加滾動條到vue onsenui v-ons卡

如果我添加了許多v-ons-list-item元素，OnsenUI2 ons-card（尤其是Vue2.js v-ons-card）的文檔自動在內容旁邊顯示一個滾動條。如何自動添加滾動條到vue onsenui v-ons卡

在這裏看到：https://onsen.io/v2/api/vue/v-ons-card.html

這裏，當我修改與額外的列表項的教程會發生什麼的截圖，和滾動條補充說：

但是當我手動做我的代碼我沒有滾動條。

<v-ons-card> 
    <div class="title"> 
    My title here 
    </div> 
    <div class="content"> 
    <v-ons-list> 
     <!-- <v-ons-list-header>row 1</v-ons-list-header> --> 
     <v-ons-list-item>Row 1</v-ons-list-item> 
     <v-ons-list-item>Row 2</v-ons-list-item> 
     <v-ons-list-item>Row 3</v-ons-list-item> 
     <v-ons-list-item>Row 4</v-ons-list-item> 
     <v-ons-list-item>Row 5</v-ons-list-item> 
     <v-ons-list-item>Row 6</v-ons-list-item> 
     <v-ons-list-item>Row 7</v-ons-list-item> 
     <v-ons-list-item>Row 8</v-ons-list-item> 
     <v-ons-list-item>Row 9</v-ons-list-item> 
     <v-ons-list-item>Row 10</v-ons-list-item> 
     <v-ons-list-item>Row 11</v-ons-list-item> 
     <v-ons-list-item>Row 12</v-ons-list-item> 
     <v-ons-list-item>Row 13</v-ons-list-item> 
     <v-ons-list-item>Row 14</v-ons-list-item> 
     <v-ons-list-item>Row 15</v-ons-list-item> 
     <v-ons-list-item>Row 16</v-ons-list-item> 
    </v-ons-list> 
    </div> 
</v-ons-card>

它是如何實現的？

該示例沒有顯示完整的CSS，而在鉻devtools中，我無法打開並顯示演示應用程序。 :-(

添加style="overflow: auto"到一個div包裹卡內部，該卡的內容，或者卡本身並不做任何事情。

來源

2017-10-17 pashute

有該教程中沒有額外的CSS。在圖像中的滾動條是在頁面內容上，而不是在卡片元素上，只需設置一個height和overflow: auto，你就可以得到你的卡片滾動條

來源

2017-10-23 01:25:31

如何自動添加滾動條到vue onsenui v-ons卡

回答

相關問題