ecmascript-6 - React Router v4 + Regex 不喜欢模板文字

标签 ecmascript-6 react-router template-literals

React Router 4.0.0 附带了 Regex 来验证查询字符串参数。 但是,它似乎与 ES6 模板文字不兼容。

这是一个非常简单的示例:

<BrowserRouter>
  <Switch>
    <Route Route path={routeConstant} component={MyComponent} />
  </Switch>
</BrowserRouter>

如果您尝试使用以下值,您会发现前 2 个常量有效,但第三个常量无效。

const root = 'folder'
const routeConstant1 = '/folder/:id(\d+)'  // <= /folder/21 matches
const routeConstant2 = `/${root}/:id`      // <= /folder/21 matches
const routeConstant3 = `/${root}/:id(\d+)` // <= /folder/21 does not match

可能有一个非常好的解释(总是有),但我真的很感激一些指示,因为这感觉有点令人困惑。提前致谢。

最佳答案

好吧,我猜我发布这个问题的速度太快了。

答案在于模板文字的工作方式: ECMAScript 6 - Template Literals

=>“反斜杠不被解释”

所以让routeConstant3工作的解决方案就是这样写:

const routeConstant3 = `/${root}/:id(\\d+)`

关于ecmascript-6 - React Router v4 + Regex 不喜欢模板文字,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43067371/

相关文章:

javascript - 模板文字内的循环?

javascript - 如何获取以下 ES6 循环中的前面的文本?

javascript - 为什么属性分配的箭头函数在声明时绑定(bind) this ?

reactjs - 如何在 react 中使超链接外部?

javascript - 为什么 react-transition-group 在路由更改时不调用 componentWillEnter 或 componentWillLeave?

javascript - 插入 React Link 组件并将其作为 prop 传递

javascript - 尝试将 JSON 对象与 JavaScript ES6 模板文字一起使用时出错

javascript - 如何在模板文字中隐藏空字符串?

javascript - 如何将数组中的对象转换为特定格式

javascript - ES6 模块 : How to automatically re-export all types in the current directory from index. js?