清除React中的输入

import React, { useState } from 'react';

function InputComponent() {
  const [inputValue, setInputValue] = useState('');

  const handleInputChange = (event) => {
    setInputValue(event.target.value);
  };

  const handleClearInput = () => {
    setInputValue('');
  };

  return (
    <div>
      <input type="text" value={inputValue} onChange={handleInputChange} />
      <button onClick={handleClearInput}>Clear</button>
    </div>
  );
}

import React, { useRef } from 'react';

function InputComponent() {
  const inputRef = useRef(null);

  const handleClearInput = () => {
    inputRef.current.value = '';
  };

  return (
    <div>
      <input type="text" ref={inputRef} />
      <button onClick={handleClearInput}>Clear</button>
    </div>
  );
}