javascript - 从 URL 中删除 '%20' - React-Router

Question

我正在使用 React，但遇到了一个问题，尽管是一个美观问题而不是功能问题。

我正在生成react-route来自名称 API。该路由工作正常，但由于名称有空格，它们在 url 中显示为: example.com/lookup/David%20Attenborough

示例:<Link to='{/lookup/' + props.data.name}>{props.data.name}</Link>

有没有一种聪明的方法可以删除空格:example.com/lookup/DavidAttenborough甚至与 +或-替换空格而不丢失 react-router 的结构完整性.

Answer 1

您可以使用正则表达式在 url 中添加(- 或 +)示例

let name = props.data.name;
name = name.replace(/\s+/g, '-');
const url = `/lookup/${name}

<Link to={url}>{props.data.name}</Link>

您可以添加 + 或 -