Можно ли определить маршрут ha sh в следующем. js?

Question

Я уже создал модальный компонент с <HashRouter> в react-router, который стал активным и неактивным с ha sh url, т.е. модалы неактивны, когда url /route и modal1 активны, когда url /route#modal1. Есть какие-то способы определить маршруты ha sh в следующем. js?

Answer 1

Часть URL, начинающаяся с символа ha sh (который идентифицирует сущность html), никогда не отправляется на сервер, поэтому вы не можете сопоставить URL-адрес сервера (если браузер загружает /route#modal1, сервер будет load /route) то, что вы можете сделать:

Option 1 Обрабатывать клиентскую сторону модального рендеринга, используя next/router в вашем компоненте, примерно так:
(я предполагаю вы используете компоненты класса)

  import Router from 'next/router'

  ....

  componentDidMount(){
    let id = Router.asPath.match(/#([a-z0-9]+)/gi )
    if(id){
      // i will show the modal
    }else{
      // something else
    }
  }

Вариант 2 Передать идентификатор в URL без #.
В вашем server.js добавить маршрут, подобный следующему:

  server.get('/route/:id?', (req, res) => {
    let {id} =  req.params 
    return app.render(req, res, '/mypage', { id})
  })

А затем захватите удостоверение личности, напр. в getInitialProps

  static async getInitialProps (context) {
    let ctx  = context.query;
    return ctx
  }

и обрабатывать модальные

  componentDidMount(){
    let {id} =  this.props    
    if(id){
      // i will show the modal
    }else{
      // something else
    }
  }