将 ScrollChor 与 NavItem 一起使用时出错

Question

我收到这个错误，

警告：validateDOMNesting(...)：不能作为的后代出现。请参阅 HeaderNavigation > NavItem > SafeAnchor > a > ... > Scrollchor > a。警告

使用此代码，

import React from 'react';
import Navbar from 'react-bootstrap/lib/Navbar'
import {Nav, NavItem} from 'react-bootstrap';
import Scrollchor from 'react-scrollchor';


export default React.createClass ({
    render() {
        return (
            <div>
                <Navbar inverse fixedTop>
                    <Navbar.Header>
                        <Navbar.Brand>
                            M2 Consulting
                        </Navbar.Brand>
                    </Navbar.Header>
                    <Nav pullright bsStyle = "pills" active>
                        <NavItem><Scrollchor to="#services">Services</Scrollchor></NavItem>
                        <NavItem><Scrollchor to="#work">Latest Work</Scrollchor></NavItem>
                        <NavItem><Scrollchor to="#contact">Contact Us</Scrollchor></NavItem>
                    </Nav>
                </Navbar>
            </div>
        );
    }
});

我认为这是由于 NavItem 和 Scrollchor 都使用了 href，

如何在使用 Scrollchor 的同时保留 NavItem 的样式？

感谢帮助。

Answer 1

NavItem 中有一个，所以我删除了 with 并简单地使用了。

将 ScrollChor 与 NavItem 一起使用时出错

Error using ScrollChor with NavItem

scroll

reactjs

react-bootstrap