How to make such a router in react?

Question

JavaScript

In general, there is a page, for example, an authorization page (/auth), I need the same authorization page to be displayed with some changes, for example, an additional input field, or other text information. Is it possible to do this? Do not create separate components and logic for a separate page, which is essentially a copy of the first one (with minor cosmetic changes).

Answer 1

The question can be rephrased as follows:
1) is it possible to write some kind of dynamic template in React
2) depending on what in my task to change the template
Answers:
1) yes, you can
2) you can start, for example, on window.location.pathname . If /auth is there - draw a template + such and such a set of inputs or whatever you need, if /test is there, then another. You can also immediately set some parameters in the constructor in the state, on the basis of which you will display the template and other different options.
In the render function it might look something like this:

...
render() {
  let template
  if (window.location.pathname.indexOf('auth') !== -1) {
    template = <div>это auth</div>
  } else {
    template = <div>это не auth</div>
  }
  return template
} 
...

Answer 2

React router v4 has been beautifully redesigned. At first it was not clear why it was so, it seemed not even convenient, but after an hour I understood. Create a default template and write components.