Javascript 如何通过路由传递数据

我无法通过路由发送数据

路线：

export default function Routes() {
  const [registers, setRegisters] = useState("Initial state");
  return (
    <BrowserRouter>
      <Switch>
        <Route
          path="/register"
          exact
          render={(props) => (
            <Register
              {...props}
              personalData={registers}
              setPersonalData={setRegisters}
            />
          )}
          personalData={registers}
          setPersonalData={setRegisters}
        />
        <Route
          path="/registersecondstep"
          exact
          render={(props) => (
            <RegisterSecondStep
              {...props}
              personalData={registers}
              setPersonalData={setRegisters}
            />
          )}
        />
      </Switch>
    </BrowserRouter>
  );
}

导出默认函数路由（）{
常量[寄存器，设置寄存器]=使用状态（“初始状态”）；
返回(
(
)}
personalData={registers}
setPersonalData={setRegisters}
/>
(
)}
/>
);
}

通过道具接收状态的我的组件：

export default function Register(props) {
  return (
     <input
     className="placeholder"
     placeholder="NameToBeAddedOnTheState"
     onChange={(e) =>
     props.setPersonalData(...props.personalData, e.target.value)
  }

导出默认功能寄存器（props）{
返回(
props.setPersonalData（…props.personalData，例如target.value）
}

我没有收到我想要的（先前状态+e.target.value）：( 我做错什么了吗

我已经记录了personalData，并且我收到了“初始状态”（I）的第一个字母：

//props.setPersonalData（…props.personalData，e.target.value）

当我在没有“…props.”的情况下记录personalData时，它确实可以工作，但不携带以前的状态

//props.setPersonalData（personalData，e.target.value）