在特定路线上渲染组件 - 正则表达式路径

Question

我试图仅在几个特定路径中渲染组件 (header)，而不是在它们的 children 中，即 /foo 而不是 /foo/bar。

假设我有一组路径： let paths = ['/foo', '/bar', '/baz']

我尝试这样做，但没有成功：

    const x = paths.map(e => `(${path}${e}/?$)`)
    <Route
      path={x.join('|')}
      component={this.makeMyComponent}
    />

这也不起作用：

    const x = paths.map(e => `(${e}/?$)`)
    <Route
      path={`${path}(/foo$|/bar$|/baz$})}
      component={this.makeMyComponent}
    />

但它确实在在线正则表达式引擎中匹配：

Answer 1

这有效：

    <Route
      render={props => paths.some(e => props.location.pathname.endsWith(e)) ? this.makeMyComponent() : null}
    />

Rendering a component on specific routes - Regex path