Scrollable List Component from Material-UI in React

reactjs material-ui
optional picture optional · May 4, 2017 · Viewed 50.2k times · Source

How to make the List component (see http://www.material-ui.com/#/components/list) fixed-size and scrollable? Every time I add a new ListItem the List expands, however I would like to be able to scroll through it if content gets bigger than the container.

Answer

optional picture optional · May 4, 2017

I just found out that you can add properties. 'maxHeight' and 'overflow' are the ones I was needing to solve my problem. For example for a List in a Paper container:

<Paper style={{maxHeight: 200, overflow: 'auto'}}>
  <List>
   ...
  </List>
</Paper>

Related questions

× TypeError: Cannot read properties of undefined (reading 'map')

When I try to run this code it gives me this error: × TypeError: Cannot read properties of undefined (reading 'map') I don't know why. I have tried possible means, but it didn't work. import React from 'react'; import Grid from …

Read More
Invalid hook call. Hooks can only be called inside of the body of a function component

I am new to React and Now I would like to show some record in the table and now I got this error. Help me, please. Invalid hook call. Hooks can only be called inside of the body of a …

Read More
What does the error "JSX element type '...' does not have any construct or call signatures" mean?

I wrote some code: function renderGreeting(Elem: React.Component<any, any>) { return <span>Hello, <Elem />!</span>; } I'm getting an error: JSX element type Elem does not have any construct or call signatures …

Read More