React-Bootstrap / React-Router-Bootstrap 中 NavBar 品牌化的最佳实践

Question

React Bootstrap 和 React Router 中的锚标签存在问题。我很好奇其他人是如何处理这种情况的。可以只留下带有 href 的锚标记，例如 <a href="/">Site Title</a> 并避免使用 IndexLinkContainer。还有使用MenuItem如.

<Navbar.Brand>
    <IndexLinkContainer to={{pathname: '/'}}>
          <MenuItem>TitleName</MenuItem>
     </IndexLinkContainer>
 </Navbar.Brand>

但是，这会在导航栏的最左侧留下一个丑陋的项目符号点。如果其他人对如何解决这个问题有任何想法，我将不胜感激。

Answer 1

这就是我所做的（使用来自 react-router-bootstrap 的 LinkContainer）：

        <LinkContainer to="/" style={{ cursor: 'pointer' }}>
            <Navbar.Brand>
                <span style={{ width: 95 }}>Some text</span>
                <img  src="somesrc" style={{ height:20, float:'right', marginLeft:10 }}/>
            </Navbar.Brand>
        </LinkContainer>

包含站点的名称和徽标。没有要点，但我找不到避免使用 LinkContainer 的方法..

React-Bootstrap / React-Router-Bootstrap 中 NavBar 品牌化的最佳实践

Best Practices for NavBar Branding in React-Bootstrap / React-Router-Bootstrap

javascript

css

twitter-bootstrap

reactjs

react-bootstrap