React Reference > LazyList Component

<LazyList />

使い方 

renderRow(index) {
    return (
      <ListItem key={index}>
        {'Item ' + (index + 1)}
      </ListItem>
    );
  }

  render() {
    return (
      <Page renderToolbar={() => <MyToolbar title='LazyList' />} >
        <div style={{height: 100}}>
          <LazyList
            length={1000}
            renderRow={() =>
              <ListItem key={index}>
                {'Item ' + (index + 1)}
              </ListItem>
            }
            calculateItemHeight={() => 44}
          />
        </div>
      </Page>
    );
  }
}

Prop一覧

[編集]
名前 型 / デフォルト値 概要
modifier string The appearance of the lazy list. （翻訳中） Optional.
length number The length of the list. （翻訳中） 必須
renderRow func A function given the index of the to display row, renders it. （翻訳中） 必須
calculateItemHeight func A function given the index of the to row, returns the height of it. （翻訳中） 必須

お困りですか?

Onsen UIに関する質問は、Stack Overflowにてonsen-uiタグを付与してください。Onsen UIチームはあなたの問題解決をお手伝いします。

バグ報告や機能要望については、GitHub Issuesに記載をお願いいたします。

あわせて、下記の情報も参考にしてください。