javascript - React Router v4 - 刷新时的重定向和渲染问题

Question

首先，

• 我是 JS 和 React 的新手（我开始学习 JS 3 个月后）。
• 使用 React Router v4（由于课程限制）
• 没有使用 Redux 和 React Hooks（我还没学过这些）

如果用户刷新窗口，它会停留在同一个地址上——我认为它在技术上与你在地址栏上附加关键字（路由）并按下enter键时相同——（如果你不使用redirect或任何修改路由），对特定情况有好处；但是，不利的一面是我的情况（不确定这是否真的是真的..如果我错了请告诉我）。

---

- 我要实现三个目标，

• 1a。路由路径与状态相匹配，当用户提交输入值时keyword，该状态是初始状态并且与用户输入相同cats

• 2a. 当用户刷新窗口时，它会回到初始componentDidMount状态（重定向到/cats）

• 3a。当用户键入不存在的地址时，会呈现 404 错误组件

- 我必须实现这些目标的问题是，

• 1b。如果我使用Redirect实现“2a”，然后如果我键入不存在的路由（例如“/catsasldkja”），它不会显示404错误组件并重定向到/cats

• 2b。如果我使用Switch组件来实现“3a”，它会按预期呈现 404 错误组件；但是，它停留在同一个地址上，因此当用户在该/cats地址上并刷新窗口时，它工作得很好，但是当用户在其他路由（地址）上时/dogs，/brandon它会呈现 404 错误组件：PageNotFound.js，因为keyword状态回滚到初始状态，即，cats但路径仍然是 on /brandon，并且keyword状态与路由路径不匹配，/cats因此它呈现 404 组件

我怎么可能解决这个问题？

这是我的Git 存储库 和 实时链接

非常感谢您提前抽出时间！

标签： javascriptreactjsreact-router