[React][ 라이브러리 소개] 자동으로 크기가 바뀌는 textarea

# react-textarea-autosize를 활용해서 자동 크기 변환 textarea을 사용해보자

- 텍스트 편집이 필요한 컴포넌트들을 개발하다보면 종종 textarea를 사용할 일이 있고, 입력되는 텍스트에 따라 자동으로 크기가 변경되는 스펙이 요구될 때가 있습니다. 이번 포스팅에서는 이런 경우 유용한 라이브러리를 소개하려고 합니다.

# 깃헙 페이지

https://github.com/Andarist/react-textarea-autosize

GitHub - Andarist/react-textarea-autosize: <textarea /> component for React which grows with content

 

# 사용방법

- 설치합니다

yarn add react-textarea-autosize

- 아래와 같이 사용하시면 됩니다.

import TextareaAutosize from 'react-textarea-autosize';

React.renderComponent(
  <div>
    <TextareaAutosize />
  </div>,
  document.getElementById('element'),
);

- 아래와 같은 prop들을 넘겨 줄 수 있으며, 저의 경우에는 onHeightChange가 활용처가 많았습니다.

 

# 데모 사이트

- 데모 사이트에 여러 케이스들이 잘 구현되어 있으니, 참고하시기 바랍니다

https://andarist.github.io/react-textarea-autosize/

React <TextareaAutosize /> component

 

---