reactjs - Δρομολογητές στο Nextjs

Κάνω αλλαγές στην υπάρχουσα εφαρμογή μου η οποία είναι φτιαγμένη με ReactJS+Typescript και την έχω μεταφέρει σε NextJs μαζί με Typescript.

Πώς μπορώ να κάνω αλλαγές στον δρομολογητή; Έλεγξα την τεκμηρίωση του Nextjs αλλά μπερδεύομαι πολύ.

Αυτήν τη στιγμή η δρομολόγηση βρίσκεται στο αρχείο μου App.tsx. Να ο κώδικας. Θέλω να κάνω αλλαγές γιατί όταν κάνω κλικ στο handleSave εκείνη τη στιγμή, η ανάρτηση του ιστολογίου μου δεν αποθηκεύεται. Πιστεύω ότι το πρόβλημα οφείλεται στη δρομολόγηση.

    return (
      <div className="All-Routes">
        <Switch>
          <Route
            exact
            path="/"
            component={props => <Index {...props} posts={this.state.posts} />}
          />
          <Route
            path="/posts/:id"
            component={props => (
              <Data {...props} post={this.state.posts[props.match.params.id]} />
            )}
          />
          <Route
            exactpath="/new"
            component={props => <Saving {...props} onSave={this.handleSave} />}
          />
        </Switch>
        <LocationDisplay />
      </div>
    );
  }
}
export default App;

Απάντηση #1

δημιουργήστε ένα αρχείο routes.js όπως παρακάτω:

const nextRoutes = require('next-routes')
const routes = (module.exports = nextRoutes())

routes.add('/', 'index')

και γράψε ένα server.js με το expressjs και πρόσθεσε σε αυτό την ακόλουθη γραμμή:

const routes = require('./routes')
const handler = routes.getRequestHandler(app)
...
server.get('*', (req, res) => {
    handler(req, res, parsedUrl)
  })