首页 > 解决方案 > 如何在 Meteor 中集成 React Router?

问题描述

我正在尝试在 Meteor Project 中使用 React Router 集成路由。我遵循了 Meteor React 文档,但不知何故它不起作用。尝试使用“Router”而不是“BrowserRouter”,但没有运气。对此有任何建议。

进口/启动/客户端/routes.js

import { BrowserRouter, Route, Switch } from "react-router-dom";

import App, City , NotFound from "respective-modules";
 
export const renderRoutes = () => {
  <BrowserRouter>
    <div>
      <Switch>
        <Route exact path="/" component={App} />
        <Route exact path="/city" component={City} />
        <Route component={NotFound} />
      </Switch>
    </div>
  </BrowserRouter>;

客户端/main.html

<body>
  <div id="react-target"></div>
</body>

客户端/main.jsx

import { renderRoutes } from "/imports/startup/client/routes.js";

Meteor.startup(() => {
  render(renderRoutes(), document.getElementById("react-target"));
});

但是出现了一个空白页面。

标签: meteorreact-routerreact-router-dom

解决方案


如果您显示的代码是正确的(即,从您正在运行的代码中准确复制),那么您只需要一个额外的大括号:

export const renderRoutes = () => {
  <BrowserRouter>

需要是:

export const renderRoutes = () => 
  <BrowserRouter>

或者

export const renderRoutes = () => {
  return <BrowserRouter>

推荐阅读