React应用程序

Question

我正在尝试在React + Electron应用程序中实现Bootstrap导航。

这是我写的JSX代码：

render: function () {
  if (this.state.loading) {
    return (
      <div className="jumbotron">
        <h1 className="display-3">Let us load your data</h1>
        <p>It may take a while</p>
      </div>
    );
  }

  return (
    <div>
      <ul className="nav nav-pills nav-stacked">
        <li role="presentation" className="active">
          <a href="#">
            Home
          </a>
        </li>
        <li role="presentation">
          <a href="#">
            Profile
          </a>
        </li>
      </ul>
    </div>
  );
}

这就是呈现的内容：

似乎不会呈现nav-pills，nav-stacked和active类。

我也试过渲染表格：

return (
  <div>
    <table className="table table-striped table-bordered">
      <tbody>
        <tr>
          <th>1</th>
          <th>2</th>
          <th>3</th>
        </tr>
        <tr>
          <td>4</td>
          <td>5</td>
          <td>6</td>
        </tr>
        <tr>
          <td>7</td>
          <td>8</td>
          <td>9</td>
        </tr>
      </tbody>
    </table>
  </div>
);

这个按预期工作：

导航器无法正常工作吗？

Answer 1

尝试使用react-bootstrap.link - https://react-bootstrap.github.io/

Answer 2

该项目正在使用Bootstrap 4而不是Bootstrap 3，因为我认为......