Блог

Главная - Вопросы по программированию - Как реализовать несколько компонентов приложения на основе URL-адреса

Как реализовать несколько компонентов приложения на основе URL-адреса

#reactjs

Вопрос:

мне нужно создать какое-то многостраничное приложение для моих клиентов. Основная цель состоит в том, что, основываясь на URL-адресе, мне нужно загрузить определенный App.js файл.

моя структура папок

Тогда, например, если пользователь переходит на локальный хост:3000/партнер1, мне нужно включить App.js из папки контекст/партнер1 и т.д.

В моем index.js файл я создал функцию:

 const renderApp = () => {
  return (
    <App/>
  )
}

который называется ниже так:

 ReactDOM.render(
  <React.StrictMode>
    <BrowserRouter>
      {renderApp()}
    </BrowserRouter>
  </React.StrictMode>,
  document.getElementById('root')
)

как рефакторинговать этот код для загрузки компонента приложения из определенного каталога на основе URL-адреса?

Комментарии:

1. маршруты const = [ {‘ParamName1’: <ParamName1/>}, {‘ParamName2’: <ParamName1/><ParamName2/>}, ] считывают параметры и проверяют этот статический массив маршрутизатора и условно визуализируют. как вы можете видеть, имена должны соответствовать указанному компоненту в этом массиве объектов

2. @emre-ozgun не могли бы вы реализовать какой-нибудь фрагмент?

3. почему бы просто не импортировать их в app.js и использовать регулярную маршрутизацию через react-маршрутизатор, то есть вы просто регулярно их визуализируете ? вы вынуждены сохранять эту структуру папок нетронутой ? итак, ваша проблема, если я правильно понимаю, связана с тем, что вы не можете использовать имя папки для визуализации ?

Метки: