動的に生成された反応ブートストラップコンポーネントのキープロパティが見つからない

Question

私は不審な挙動を偶然見つけました。私の最後にエラーがあるのか​​、それとも反応ブートストラップのバグかはわかりません。

私は動的にナビゲーションを作成していたとき、私はきちんとkeyを定義した場合、私はfollowigエラーに

main.js:2331 Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of `Header`. See ... for more information

を取得しています。このエラーは消えますが、eventKeyは、このの世話をする必要がありますので、私の知る限り、これは、必要とするべきではありません

コードの例：

render() { 
    let routes =[ 
     { 
      name : 'Dashboard', 
      path : '/', 
     }, 
     { 
      name : 'Navigation Manager Tool', 
      path : '/tools/navigation-manager', 
     } 
    ]; 

    return (
     <Navbar inverse className="widget-header"> 
      <Navbar.Header> 
       <Nav activeKey={this.props.active.path}> 
        { 
         routes.map((route) => { 
          return (
           <NavItem eventKey={route.path} href={route.path}>{route.name}</NavItem> 
          ); 
         }) 
        } 
       </Nav> 
      </Navbar.Header> 
     </Navbar> 
    ); 
} 

注意そのいずれの問題もなく、次の作品

render() { 
    return (
     <Navbar inverse className="widget-header"> 
      <Navbar.Header> 
       <Nav activeKey={this.props.active.path}> 
        <NavItem eventKey="/" href="/">Dashboard</NavItem> 
        <NavItem eventKey="/tools/navigation-manager" href="/tools/navigation-manager">Navigation Manager Tool</NavItem> 
       </Nav> 
      </Navbar.Header> 
     </Navbar> 
    ); 
} 

Answer 1

keyとeventKeyは異なる性質です。共通点はありません。

コンポーネントの配列を作成する場合は、常にkeyを指定する必要があります。

React docs about key。