Question

我有我的React前端。我正在使用Ruby作为后端。我想将两者整合在一起，因为我的新版Ruby on Rails网络应用程序一无所有。

在此guide之后，我尝试遵循使用react-rails的方法＃1。但是，我真的很困惑。我的React前端中有大量的组件。我有index.js，Header.jsx以及典型网站NavBar拥有的所有组件（这些组件显示在Header.jsx中，由index.js调用）。

我的问题是我不知道如何在Rails中集成像这样的复杂React结构。我不知道，因为该教程仅呈现一个独立组件。因此，我决定尝试仅渲染index.js。但是，它失败了。该网页为空。

按照本教程中的结构，在我的app/assets/javascripts/components/中，我只有一个index.js，它使用ReactDOM.render()：

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import * as serviceWorker from "./serviceWorker";
import { BrowserRouter as Router, Switch, Route, Link } from "react-router-dom";
import Contact from "./components/ContactUs";
import Header from "./components/Header";
import Stats from "./components/Stats";
import Videos from "./components/Videos";
import Login from "./components/Login";
import Process from "./components/Process";
import BaseComponent from "./components/BaseComponent";

const routing = (
  <div>
    <Router>
      <Switch>
        <Route path="/" exact component={Login} />
        <Route
          path="/landingpage/videos"
          exact
          render={props => (
            <BaseComponent>
              <Videos />
            </BaseComponent>
          )}
        />
        <Route
          path="/landingpage/contact"
          exact
          render={props => (
            <BaseComponent>
              <Contact />
            </BaseComponent>
          )}
        />
        <Route
          path="/landingpage/stats/"
          exact
          render={props => (
            <BaseComponent>
              <Stats />
            </BaseComponent>
          )}
        />
        <Route
          path="/landingpage/process/"
          exact
          render={props => (
            <BaseComponent>
              <Process />
            </BaseComponent>
          )}
        />
      </Switch>
    </Router>
  </div>
);

ReactDOM.render(routing, document.getElementById("root"));

serviceWorker.unregister();

但是，没有任何显示。请帮忙。

无法使用react-rails将ReactJS与Rails集成

0 个答案: