How do I render a component, not a page in NextJS?

Question

I am trying to fix a button in a NextJS app that is inside of the authentication. The app does not use pages for authenticated routes, everything is /# and I am trying to figure out how to route the Settings component from a button. The original developer did not want to have any page paths in authentication.

Is there a process like in React, such that I can route to a component not page?

<Router>
  <Switch>
    <Route path='/settings'>
      <Settings />
    </Route>
  </Switch>
<Router>

I feel like withRouter might be the key, but I cannot find the path I need to the component.

dna · Accepted Answer · 2021-03-22 08:33:32Z

1

I think that you approch Is not the best for a nextjs app. Anyway you can disable the nextjs file system routing in nextjs config and use a custom server

module.exports = {
  useFileSystemPublicRoutes: false,
}

Then you can use the react-router component. Take a look at this tutorial to see a more detailed example.

edited Mar 22, 2021 at 8:33

answered Mar 21, 2021 at 20:39

dna

2,3272 gold badges14 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How do I render a component, not a page in NextJS?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related