Question

我正在处理一个提交处理程序，我想将用户导航到/path?query，但我首先发现这样做

window.location.pathname = `/path?query`

由于?被编码而无法工作。然后我尝试了

const handleSubmit = ({ email }: Values) => {
  window.location = {
    ...window.location,
    pathname: "/path",
    search: `?email=${email}`,
  };
};

但是我得到了TypeError: Illegal invocation。这是一个代码段。

const {useState} = React;

const handleSubmitFactory = email => () => {
  window.location = {
    ...window.location,
    pathname: "path",
    search: `?email=${email}`,
  };
};

const handleChangeFactory = setEmail => ({ target: { value } }) => {
  setEmail(value);
};

const Example = ({title}) => {
  const [email, setEmail] = useState("");

  return (
    <form onSubmit={handleSubmitFactory(email)}>
      <label>
        Email:
        <input type="email" value={email} onChange={handleChangeFactory(setEmail)} />
      </label>
      <input type="submit" value="Submit" />
    </form>
  );
};

// Render it
ReactDOM.render(
  <Example title="Example using Hooks:" />,
  document.getElementById("react")
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.4/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.4/umd/react-dom.production.min.js"></script>
<div id="react"></div>

有没有办法更新

Answer 1

window.location = `/path?query`

Answer 2

window.location.href = `/path?query`

这对我有用

有没有办法直接更改`window.location`对象？

2 个答案: