如何在 React 上自定义组件 Bootstrap

Question

我正在试用 React Bootstrap 并想更改自定义导航。我正在做这样的事情。

const navInstance = (
    <Nav bsStyle='pills'>
        <NavItem eventKey={1} href='/home'>NavItem 1 content</NavItem>
    </Nav>
);

React.render(navInstance, document.querySelector('.container'));

关于如何更改颜色有什么想法吗？另外，如何将导航固定到顶部，这样当页面滚动时，导航保持固定？

Answer 1

我相信您缺少 Navbar 组件作为父组件。您的组件应如下所示：

<Navbar fixedTop>
    <Nav>
        <NavItem eventKey={1} href='#'>Link</NavItem>
        <NavItem eventKey={2} href='#'>Link</NavItem>
    </Nav>
</Navbar>

fixedTop 属性将通过从 bootstrap.css 添加适当的类来保持固定。颜色的变化将覆盖 css 类，您应该可以开始了。

如何在 React 上自定义组件 Bootstrap

How to customize a component on React Bootstrap

twitter-bootstrap

reactjs