node.js - 如何在 ReactRouter V4 Switch 设置中使用 Google Analytics

Question

我正在尝试在我的 React 单页应用程序中实现 Google Analytics，但要做到这一点，我知道我需要使用 history支柱。我正在使用 Switch 设置，但这似乎不起作用。

<Switch history={history}>
    <Route exact path="/" component={place}/>
    <Route path="/about" component={otherplace}/>
    <Route component={error}/>
</Switch>

如果我更改<Switch>到 <Router>分析工作正常，但错误页面会在每个页面上呈现，并且当 URL 路径更改时，页面需要刷新。

Answer 1

问题在于错误组件存在于所有路由上。

试试这个:添加不同的 404 错误路由:

<Route path='/404' component={error} />

将所有不匹配的路由路由到它:

<Redirect from='*' to='/404' />

这应该仅在不存在的页面上显示错误组件。

这是一个执行此操作的开关:

<Switch history={history}>
    <Route exact path="/" component={place}/>
    <Route path="/about" component={otherplace}/>
    <Route path='/404' component={error} />
    <Redirect from='*' to='/404' />
</Switch>