Bring up scrollbar when <TextareaAutosize> is shrunk

4.1k Views Asked by At

I am using a <TextareaAutosize> component from the Material UI Library in my React app, as such:

<TextareaAutosize 
   minRows="2"
   style={{resize: "vertical"}}
/>

This creates a textarea that autosizes based on the size of the content. I have styled it so that the user is only able to manually expand vertically.

The current behavior is that, when the user shrinks the textbox, there is no way to view the content out of sight. My goal is to bring up the scroll bar when the user shrinks the text area.

View CodeSandbox to test.

1

There are 1 best solutions below

0
Summer On BEST ANSWER

Simply add overflow: 'auto' to the style attribute.

<TextareaAutosize
  minRows="2"
  style={{ width: '50%', resize: 'vertical', overflow: 'auto' }}
/>

Codesandbox