如何在使用更新值重新渲染组件后更新输入和下拉列表中的值？

import React, { useState } from 'react';

const MyComponent = () => {
  const [inputValue, setInputValue] = useState('');
  const [selectValue, setSelectValue] = useState('');

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

  const handleSelectChange = (event) => {
    setSelectValue(event.target.value);
  };

  const handleUpdateValues = () => {
    // 更新输入和下拉列表的值
    setInputValue('新的输入值');
    setSelectValue('新的下拉列表值');
  };

  return (
    <div>
      <input type="text" value={inputValue} onChange={handleInputChange} />
      <select value={selectValue} onChange={handleSelectChange}>
        <option value="option1">选项1</option>
        <option value="option2">选项2</option>
        <option value="option3">选项3</option>
      </select>
      <button onClick={handleUpdateValues}>更新值</button>
    </div>
  );
};

export default MyComponent;