Eksik anahtar özellik tepki-önyükleme bileşenleri

Question

Şüpheli davranışları genelinde tökezledi var oluşturulan ve ben hata benim ucunda, ya bu bir tepki-önyükleme hata olup olmadığından emin değilim.

Dinamik navigasyon oluşturma, ben followig hatayı alıyorum

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

düzgün key tanımlar ancak AFAIK bu gerekli olmamalıdır eğer eventKey bu dikkatli olmalıdır, çünkü bu hata, kaybolur kod

Örnek:

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> 
    ); 
} 

Bildirim bu sorunsuz aşağıdaki eserlerini

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 ve eventKey farklı özellikleri vardır. Ortak noktamız yok. Eğer bileşenlerin dizi oluşturursanız

key daima verilmelidir.

React docs about key. ile