Question

React Bootstrap 和 React Router 中的锚标记存在问题。我很好奇其他人如何处理这种情况。可以只使用<a href="/">Site Title</a>等href保留锚标记，并避免使用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品牌的最佳实践

1 个答案: