0

I have this React component, which successfully grows the textarea.

.textarea {
  resize: none;
  overflow: hidden;
  box-sizing: border-box;
}


export default function Textarea({
  className,
  onChange,
  defaultValue,
  ...attrs
}) {
  const handleInput = (e) => {
    const h = e.target.scrollHeight
    e.target.style.height = '0px'
    e.target.style.height = `${h}px`
    onChange?.(e)
  }

  return (
    <textarea {...attrs} defaultValue={defaultValue} onInput={handleInput} className={styles.textarea} />
  )
}

How do I get it to shrink though, it only grows?

Lance
  • 75,200
  • 93
  • 289
  • 503
  • Does this answer your question? [javascript/react dynamic height textarea (stop at a max)](https://stackoverflow.com/questions/39401504/javascript-react-dynamic-height-textarea-stop-at-a-max) – Tim van Dam Jun 25 '22 at 09:18
  • For some reason none of these answers are working, hmm... – Lance Jun 25 '22 at 11:23

0 Answers0