Material-ui: List + Pagination

[chnliquan]

I need to put a pagination under the List, but material-ui only provide it for use in the Table, which makes me confused. I want to use the pager elsewhere, not just in the table.

[oliviertassinari]

import React from "react";
import List from "@material-ui/core/List";
import ListItem from "@material-ui/core/ListItem";
import ListItemText from "@material-ui/core/ListItemText";
import TablePagination from "@material-ui/core/TablePagination";

function SimpleList(props) {
  return (
    <div>
      <List>
        <ListItem>
          <ListItemText primary="A" />
        </ListItem>
        <ListItem>
          <ListItemText primary="B" />
        </ListItem>
      </List>
      <TablePagination
        component="nav"
        page={0}
        rowsPerPage={10}
        count={100}
        onChangePage={() => {}}
      />
    </div>
  );
}

export default SimpleList;

https://codesandbox.io/s/73mvo4xw5x

[sbiales]

This does not work, even in your code sandbox... It displays the pagination at the bottom, yes, but it does not actually reflect the rows of the list.