reactjs - React Router 中的 enocde uri

Question

有什么方法可以在 react 路由器的toprop 中对 uri 进行编码。<Link>

我的代码：

<Link to={`info/${props.movie.Title}`}> info </Link>

我试过 encodeURI() 但它不起作用。

uri = encodeURI(`info/${props.movie.Title}`)
console.log(uri);
<Link to={uri}> info </Link>

单击该链接会将 URL 显示为“ http://localhost:3000/info/Man of Steel”，而不是“ http://localhost:3000/info/Man%20of%20Steel ”。有没有办法得到后者？

编辑

反应完美。我的错。Firefox 不知何故不对 URL 栏中的空格进行编码。但是其他特殊字符会被编码。所以我的问题变成了为什么 Firefox 在 URL 栏中没有对空格进行编码。我还注意到复制粘贴链接会给出 %20 而不是空间。

与显示 %20 的其他浏览器不同，Firefox 会解码空格并将其显示在 URL 栏中。编码实际上是在后台完成的。

score 0 · Accepted Answer

您不必在 URL 地址中使用一些随机字符串。取而代之的是，您可以使用电影的 id ( info/:id )，然后通过 id 获取电影并显示给用户。结果你不需要解码字符串，因为它不可靠

score 0 · Accepted Answer

encodeURIComponent() 和 React 可以完美运行。问题是最新版本的 Firefox 没有将空间显示为编码。它是编码的。复制粘贴它会得到 %20。但它会在 Firefox URL 栏中显示为空格。其他浏览器仍然给出 %20。