How to use LazyList component in react-onsenui to display dynamic data?

Question

I'm using Axios to get dataList from the server and storing it in the state as an array. I want to use LazyList but in the document, there are not props for getting dynamic data array from the server similar dataSource in the List component but in LazyList I can only see item 1, item 2,... Is there a way to display dynamic data responses in LazyList?

I want to run like the following code with a long array list of the server but it doesn't work.

<div style={{height: 100}}>
      <Ons.LazyList
        dataSource={[{id:1,name:"maryam"],{id:2,name:"mary"}]}
        length={100}
        renderRow={(user) => (
  <Ons.ListItem>
       {user.name}
  </Ons.ListItem>
        calculateItemHeight={() =>44}
      />
</div>

Answer 1

You must delete the datasource. and place the length of the array in length attribute.put dynamic data by using index in ListItem in renderRow.

const data = [{id:1,name:"maryam"],{id:2,name:"mary"}]

 <div style={{ textAlign: 'center' }}>
      <LazyList
        modifier="inset"
        length={data.length}
        renderRow={index => (
          <ListItem
            key={index}
          >
            {data[index].name}
          </ListItem>
        )}
        calculateItemHeight={() => 44}
      />