Question

我正在尝试开发一个将其他“应用程序”作为“插件”的应用程序。该基本应用程序将仅包含基本身份验证路由，其他应用程序将在其中定义自己的路由。

我该如何使用React做到这一点？我想React Router可以有一些东西，但是我找不到它。

我来自Ruby on Rails世界，在那里我可以将gem作为引擎，而在基本应用程序上，我只会mount在给定路径上使用引擎。我一直在寻找类似的东西，例如，在我的基础App.js上，我可以简单地import ModuleARoutes from 'module-a'并以某种方式将其插入到基础应用的<Router>组件中，例如：

<Router>
    <ModuleARoutes path="/module_a" />
</Router>

非常感谢任何指导！谢谢！

更新

使用@ felipe-lanza的答案，我得到了这样的ModuleA：

import React from 'react';
import { Route } from 'react-router';
import { BrowserRouter } from 'react-router-dom';

const Example1 = () => (<div>test 1</div>);
const Example2 = () => (<div>test 2</div>);

const App = () => (
  <BrowserRouter>
    <div>
      <Route exact path="/" component={Example1} />
      <Route exact path="/example1" component={Example2} />
    </div>
  </BrowserRouter>
);

export default App;
export { App as ExampleApp };

在我的基本应用程序中，

import MainStore from './stores/MainStore';
import AuthStore from './stores/AuthStore';

import App from './App';
import ExampleApp from '@module-platform/example';
const stores = { MainStore, AuthStore };
const Routes = () => (
    <Provider { ...stores }>
        <Router>
            <Switch>
                <Route exact path="/" component={ Login } />
                <Route path="/dashboard" component={ App } />
                <PrivateRoute path="/example_app" component={ ExampleApp } />
                <Route component={ NotFound } />
            </Switch>
        </Router>
    </Provider>
);

现在，如果我导航到localhost/example_app，则可以得到预期的结果（带有“ test 1”的div）。但是，我希望导航到localhost/example_app/example_1会使div带有“ test 2”，但是仍然会呈现“ test 1”。事实上，任何带有localhost/example_app（例如localhost/example_app/asdfasdfa）的位置都会为我呈现“测试1” div。

我在做什么错了？

Answer 1

如果我理解正确，那类似于将基本应用下方的子应用呈现为不同的路线吗？

即（在index.js内部）：

<Router>
  <Route path='/' component={BaseApp}/>
  <Switch>
    <Route path='/child-path-1' component={ChildApp1}/>
    <Route path='/child-path-2' component={ChildApp2}/>
    <Route path='/child-path-n' component={ChildAppN}/>
  </Switch>
</Router>

然后每个子应用程序都可以有自己的路由，依此类推。

来自外部软件包的React Router安装路由

1 个答案: