如何在多页网站(非SPA)中使用react.js？

Question

我有一个laravel应用程序.对于具有此类路由的页面:/admin/entity/我想使用带有反应路由器的反应组件来处理/admin/entity/:id路由.

如果我使用browserify将所有组件捆绑在一个文件中,我无法访问任何组件以从外部呈现它,因为browserify将其包装到关闭状态.因此,我几乎没有问题:

我应该为每个页面创建单独的bundle.js文件并在该文件中显式呈现组件吗？

或者我应该从jsx预编译每个组件到js并从*.blade.php文件中内联呈现它？

将反应库包含到bundle.js中是否有意义,或者我可以从视图中明确加载它？

Answer 1

以下是我的意见：

• 您应该将 React 和所有代码捆绑在所有将由 React 组件呈现任何部分的页面中（根据我收集的信息，/admin/entity）。
• 你的 React 组件应该始终渲染到特定元素（例如，空的<div>），并且应该配置类似React Router 的东西，以便它忽略/admin/entity但渲染/admin/entity/:id。您面临的挑战是，任何指向不同:idURL 的链接最好都应该使用Link组件位于 React 组件内部。这将自动连接您的路由器。

您的路线可能如下所示：

<Route path="admin/entity/:id" handler={Entity} />

我相信，当你使用runRouter 时，如果浏览器的 URL 不是预期的格式，React 实际上不会渲染任何内容。