如何获取输入字段的值并在React的URL中使用它

import React, { useState } from 'react';
import { BrowserRouter, Switch, Route, Link, useParams } from 'react-router-dom';

const App = () => {
  return (
    <BrowserRouter>
      <Switch>
        <Route exact path="/" component={Home} />
        <Route path="/user/:id" component={User} />
      </Switch>
    </BrowserRouter>
  );
};

const Home = () => {
  const [inputValue, setInputValue] = useState('');

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

  return (
    <div>
      <input type="text" value={inputValue} onChange={handleChange} />
      <Link to={`/user/${inputValue}`}>Go to User</Link>
    </div>
  );
};

const User = () => {
  const { id } = useParams();

  return <h1>User ID: {id}</h1>;
};

export default App;