陣營，引導導航activeKey不會將NavItem的狀態變爲有效

Question

<Nav pullRight activeKey={1}> 
    <NavItem eventKey={1} href="#" active>技術祕籍</NavItem> 
    <NavItem eventKey={2}>生活點滴</NavItem> 
    <NavItem eventKey={3} href="#">休閒娛樂</NavItem> 
    <NavItem eventKey={4} href="#">溝通交流</NavItem> 
    <NavItem eventKey={5} href="#">關於博主</NavItem> 
</Nav> 

我想的第一個項目是活動時，它的最初，但活躍並沒有做什麼，有沒有人知道爲什麼

Answer 1

你是通過在第一個NavItem上指定「active」來覆蓋你的activeKey值。

有效設置「activeKey = {1}」即可實現您所要求的功能。但是，這也意味着你將道具硬連線到1，所以它永遠不會改變。

你真的想大概是什麼東西，包括本地狀態，即：

const Navigation = React.createClass({ 
getInitialState() { 
    return {activeKey: 1}; 
}, 

handleSelect(selectedKey) { 
    this.setState({activeKey: selectedKey}); 
}, 

render() { 

    return (
    <Navbar fixedTop> 
    <Navbar.Header> 
     <Navbar.Brand> 
     <a className="page-scroll" href="#page-top" onClick={this.handleSelect.bind(null, 0)}>Some Brand</a> 
     </Navbar.Brand> 
     <Navbar.Toggle /> 
    </Navbar.Header> 
    <Navbar.Collapse> 
     <Nav bsStyle="pills" activeKey={this.state.activeKey} onSelect={this.handleSelect}> 
     <NavItem eventKey={1} href="#">Link</NavItem> 
     <NavItem eventKey={2} href="#">Link</NavItem> 
     <NavItem eventKey={3} href="#">Link</NavItem> 
     <NavItem eventKey={4} href="#">Link</NavItem> 
     </Nav> 
    </Navbar.Collapse> 
    </Navbar> 
); 
} 
}); 

我把navbrand也是在那裏，展示如何用一個特定的值.bind單擊處理（即0表示中性 - 沒有突出顯示）。