反应路由器，正确嵌套路由

Question

我正在尝试使用react-spring为一组相关的路线设置动画。

我有一条/games/new路线，用户可以从中选择要创建的单人游戏还是多人游戏。他们有自己的路线，因为如果他们离开页面，我会保存创建进度。

不幸的是，我无法弄清楚如何使所有路线都匹配。

/games/:id路由未呈现。 NotFound组件也不是。

我在这里做错了什么？

 <Router>
        <Header />
        <Switch>
          <Route exact path="/" component={Home} />
          <Route exact path="/explore" component={Explore} />
          <Route exact path="/results" component={Results} />
          <Route
            render={({ location, ...rest }) => (
              <Transition
                native
                items={location}
                keys={location.pathname.split('/')[1]}
                from={{ opacity: 0 }}
                enter={{ opacity: 1 }}
                leave={{ opacity: 0 }}
              >
                {(loc, state) => style => {
                  return (
                    <Switch location={state === 'update' ? location : loc}>
                      <Route
                        exact
                        path="/games/new"
                        render={props => (
                          <GamesCreate {...{ ...props, style }} />
                        )}
                      />
                      <Route
                        exact
                        path="/games/new/singleplayer"
                        render={props => (
                          <GamesCreateSinglePlayer {...{ ...props, style }} />
                        )}
                      />
                      <Route
                        exact
                        path="/games/new/multiplayer"
                        render={props => (
                          <GamesCreateMultiplayer
                            {...{ ...props, style }}
                          />
                        )}
                      />
                    </Switch>
                  );
                }}
              </Transition>
            )}
          />
          <Route exact path="/games/:id" component={GamesShow} />
          <Route component={NotFound} />
        </Switch>
      </Router>