Блог

Я хочу динамически удалить .html конец URL-адреса формы до того, как он войдет Router и попадет в маршруты в моем приложении react.

пример URL-адреса, который будет введен в строке поиска браузера пользователем: fullURL:

1 — https://www.MIT.com/capmus.html

2 — https://www.MIT.com/capmus/student.html

3 — https://www.MIT.com/capmus/student/major.html

пример для чистого URL-адреса для подключения к маршрутизатору и переключения: cleanUrl: https://www.MIT.com/capmus/student/major

вот мои первоначальные мысли: определите a baseUrl и дайте ему в Router качестве basename реквизита. затем получите остальную часть URL-адреса, который идет после baseUrl, затем удалите .html его и передайте в Switch качестве location реквизита. но это не работает. теперь каждый URL-адрес автоматически переходит на страницу перенаправления, которая является последним маршрутом, что означает, что ни один из моих маршрутов больше не совпадает. раньше это совпадало. эта проблема возникает в результате предоставления location реквизита Switch .

 import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';

  getBaseName(){
     const baseUrl = 'https://www.MIT.com/capmus';
     return baseUrl
  }

  getCleanSearchPath(){
     const fullUrl = window.location.href;
     const baseUrl = this.getBaseName();
     const path = fullUrl.split(baseUrl)[1];
     const cleanSearchPath = path.split('.html').join('');
     return cleanSearchPath
  }

  render(){
    ...
    ...

    return (
      <React.Fragment>
        <Router basename = {this.getBaseName()}>
          <Switch location = {this.getCleanSearchPath()}>
            <Route path='/' />
            <Route path='/students' />
            <Route path='/students/major' />
          </Switch>
        </Router>
      </React.Fragment>
    )
  } 

есть какие-нибудь мысли или другой способ реализовать эту функциональность?
ценю ваше время и помощь.