Reactjs 如何在react中的url开头放置参数

我试图建立一个简单的POS系统，不同企业的不同用户都可以访问。我想实现的是，该网站为所有企业托管在一个地方，但它们通过具有唯一企业id的URL进行访问

就像github一样，通过

 https://github.com/USERNAME

我希望我的系统能够像

 https://example.com/BUSINESS_ID

其他URL也将跟随，即

https://example.com/BUSINESS_ID/menu
https://example.com/BUSINESS_ID/pos
https://example.com/BUSINESS_ID/supplies

我如何用react实现这一点

我试过使用

`/:business_id/menu` 

等等，但页面只是加载空白 如果您有任何关于react实现此目标的最佳方法的想法和建议，我们将不胜感激

这就是我的路由方式

在index.js中

ReactDOM.render(
  <Provider store={store}>
    <BrowserRouter>
      <Switch>
        <Route path="/:business_id/" component={App} />
        <Route path="/" component={dashboard} exact />
      </Switch>
    </BrowserRouter>
  </Provider>,
  document.getElementById('root')
);

ReactDOM.render(
,
document.getElementById（'root'））
);

在app.js中

  <Route path="/:business_id/"
    render={({ match: { url } }) => (
         <>
           <Route path={`${url}`} component={menu} exact />
             <Route path={`${url}orders`} component={orders} />
             <Route path={`${url}menu`} component={menu} />
         </>
     )}
  />

(
)}
/>

---

在我在应用程序中引入参数business\u id

之前，一切正常。请尝试使用

react路由器

match.path

而不是

match.url

道具

从React文档：

• path

  -（字符串）用于匹配的路径模式。对建筑有用 嵌套s

• url

  -（字符串）url的匹配部分。有用的 用于构建嵌套的s

考虑路由

/：businessId

<代码>匹配。路径将是

/：businessId

，而

匹配。url

将填充

:businessId

值，例如

/3423ui67x

<Router path={"example.com/:business_id"} exact="true"/>

---

将帮助您将所需id发送到example.com，如example.com/3

您使用的路由器是否正确？什么版本？你必须添加一些基本url。。。有关详细答案，请在此处添加一些路由代码。我正在使用react router dom

“react router dom”：“^5.2.0”

，与我的软件包中一样。json@SoftwareEnggUmar，好的，让我来编辑这个问题