Twitter bootstrap 为什么我的navbar是从React引导垂直渲染的，而不是文档中显示的方式？

我已经尝试将我的navbar类从引导导入到我的新react应用程序中，但它没有按预期呈现

这是我的密码：

import React, { Component } from 'react';
import { Navbar, Nav, NavItem, MenuItem, NavDropdown } from 'react-bootstrap';
import { Link } from 'react-router-dom';

export default class SplashNav extends Component {
  render() {
    return (
      <Navbar>
        <Navbar.Header>
          <Navbar.Brand>
            <a href="#home">React-Bootstrap</a>
          </Navbar.Brand>
        </Navbar.Header>
        <Nav>
          <NavItem eventKey={1} href="#">
            Link
         </NavItem>
          <NavItem eventKey={2} href="#">
            Link
    </NavItem>
          <NavDropdown eventKey={3} title="Dropdown" id="basic-nav-dropdown">
            <MenuItem eventKey={3.1}>Action</MenuItem>
            <MenuItem eventKey={3.2}>Another action</MenuItem>
            <MenuItem eventKey={3.3}>Something else here</MenuItem>
            <MenuItem divider />
            <MenuItem eventKey={3.4}>Separated link</MenuItem>
          </NavDropdown>
        </Nav>
      </Navbar>
    )
  }
}

import React，{Component}来自'React'；
从“react bootstrap”导入{Navbar、Nav、NaviItem、MenuItem、NavDropdown}；
从'react router dom'导入{Link}；
导出默认类SplashNav扩展组件{
render（）{
返回(
链接
链接
行动
另一个动作
还有别的吗
分离环
)
}
}

及

import React，{Component}来自'React'；
从'react router dom'导入{Link}；
从“react bootstrap”导入{Jumbotron、Grid、Row、Col、Image、Button}；
导入“/SplashScreen.css”；
从“./SplashNav.js”导入SplashNav；
导出默认类SplashScreen扩展组件{
render（）{
返回(
欢迎来到Vocafy
这就是如何与您的员工沟通

登录
)
}
}

我阅读了引导文档，我应该拥有所有必要的CDN等。提前感谢您的帮助

运行您的代码时，导航栏看起来正常。仔细检查您是否在public index.html中正确链接到bootstrap.css。在测试代码时，我使用了：

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

---

如果这不是您的问题，请尝试在不导入

SplashScreen.css

的情况下渲染组件。可能您有一些样式覆盖了引导程序。

刚刚检查过，似乎我在使用引导程序4链接。这和移除和重新安装react引导似乎有帮助。非常感谢。

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">