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)
  })