Здравствуйте, я пытаюсь узнать React с помощью варианта использования интернет-магазина. У меня есть 200 000 предметов в базе данных, которые сгруппированы по категориям. Каждый продукт или каждая категория продукта должны быть доступны напрямую через следующую форму URL:
для продуктов:
http://domain/product_name
http://domain/product_name2
и т.д ..
для категорий (представляющих меню)
http://domain/laptops/gaming
будет отображаться
имя_продукта и имя_продукта2
и т.д ..
Поскольку категории и продукты будут добавляться / изменяться каждую ночь, компонент «Маршрутизатор» необходимо будет «заново создавать», чтобы правильно обрабатывать маршруты для новых продуктов и категорий, поскольку я не использую такие пути, как
http://domain/product/product_name... Я не могу использовать статический маршрут как
путь = / продукт /: идентификатор
...
У меня есть простой PHP rest api, который возвращает тип пути
http://domain/product_name -> тип товара
http://domain/laptops/gaming -> тип секции
на основе такого api
я могу правильно определить компонент, который будет использоваться для визуализации объекта, с помощью следующего кода (удален вызов API api, чтобы сделать код максимально простым)
import React from 'react';
import './App.css';
import {
BrowserRouter as Router,
Route
} from 'react-router-dom';
import ShowProduct from './components/showProduct.js'
import ShowSection from './components/showSection.js'
const PageLocator=({var1})=>{
{/* determine from rest API if requested path is type of product or section
if product */}
return <div><ShowProduct product={var1.path} /></div>
{/* if section */}
return <div><ShowSection section={var1.path}
{/* if etc... */}
}
class App extends React.Component {
render() {
return(
<Router>
<div>
<PageLocator path="/" var1={{path:window.location.pathname}} />
</div>
</Router>
)
}
}
Код выше действительно делает то, что я ожидаю. Проблема, с которой я сталкиваюсь, заключается в том, что я не могу проверить правильность решения из-за своего нулевого опыта работы с React, поэтому я хотел бы попросить кого-нибудь подтвердить и в конечном итоге посоветовать, как мне справиться с таким требованием с помощью React.