如何使用React创建自动增长-收缩输入？

import React, { useState } from 'react';

const AutoResizeInput = () => {
  const [value, setValue] = useState('');
  const [height, setHeight] = useState('auto');

  const handleChange = (event) => {
    setValue(event.target.value);
    setHeight(`${event.target.scrollHeight}px`);
  };

  return (
    <textarea
      value={value}
      style={{ height }}
      onChange={handleChange}
    />
  );
};

export default AutoResizeInput;

import React from 'react';
import AutoResizeInput from './AutoResizeInput';

const App = () => {
  return (
    <div>
      <h1>自动增长-收缩输入</h1>
      <AutoResizeInput />
    </div>
  );
};

export default App;