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 的方法。