在xdk中使用Framework 7虛擬列表是空的

Question

我正在使用虛擬列表，如果使用onclick按鈕事件初始化並呈現它，那麼一切正常。但是，我需要在創建特定頁面時初始化並呈現此列表，當我這樣做時列表項是空的。

var myList = myApp.virtualList('.list-block.virtual-list', { 
    items: 
    [ 
    { 
     title: 'Item 1', 
     picture: 'path/to/picture1.jpg' 
    }, 
    { 
     title: 'Item 2', 
     picture: 'path/to/picture2.jpg' 
    }, 
    { 
     title: 'Item 1000', 
     picture: 'path/to/picture1000.jpg' 
    }, 
    ], 
    template: '<li class="item-content">' + 
        '<div class="item-media"><img src="{{picture}}"></div>' + 
        '<div class="item-inner">' + 
        '<div class="item-title">{{title}}</div>' + 
        '</div>' + 
       '</li>' 
    }); 

Answer 1

我遇到恰與英特爾XDK同樣的問題和框架7.

的虛擬列表快速調試後，我意識到，它需要一個選項，rowsAfter，加載的元素。沒有它，它會計算兩個索引，如跳過和分頁限制，都是零。

我有大約2300數組元素，所以我設置rowsAfter至40，但如果你只有3個元素，你可以用3試（所以它應該顯示單元0，1和2），像這樣：

var myList = myApp.virtualList('.list-block.virtual-list', { 
    items: 
    [ 
    { 
     title: 'Item 1', 
     picture: 'path/to/picture1.jpg' 
    }, 
    { 
     title: 'Item 2', 
     picture: 'path/to/picture2.jpg' 
    }, 
    { 
     title: 'Item 1000', 
     picture: 'path/to/picture1000.jpg' 
    }, 
    ], 
    rowsAfter : 3, 
    template: '<li class="item-content">' + 
        '<div class="item-media"><img src="{{picture}}"></div>' + 
        '<div class="item-inner">' + 
        '<div class="item-title">{{title}}</div>' + 
        '</div>' + 
       '</li>' 
    });