如何在没有 Link 组件的情况下更改 gatsby 中的路由？

Question

我在反应中有一个受控的形式。当用户提交表单时，在handleSubmit运行中，在该函数中，我想将它们重定向/带到新的 url 或页面，其中 url 与它们的输入值相同。

例如用户输入“你好”，然后当表单提交时我想带他们去

http://example.com/你好

似乎</Link>(gatsby)组件在这里不起作用。那么如何在没有Link组件的情况下更改路由

这是一个搜索栏

Answer 1

您应该导入导航 API 来推送/替换历史堆栈，以便执行导航。

import { navigate } from 'gatsby'

这就是您可以在表单提交方法中使用它的方式。它类似于 React-Router 的history.push().

submit() {
  // rest of your form logic
  navigate('/hello');
}

如果你想替换历史堆栈，你可以改用navigate('/hello', { replace: true })。你可以参考 Gatsby Link文档了解更多细节。