路由器呈現意想不到的訂單成分，並導致proptype警告

繼承人我的路線：路由器呈現意想不到的訂單成分，並導致proptype警告

<Router history={browserHistory}> 
    <Route path="/" component={App}> 
     <IndexRedirect to="/Container/1" />  
     <Route path="Container" component={Container}> 
      <Route path="1" component={Component1} /> 
      <Route path="2" component={Component2} /> 
      <Route path="3" component={Component3} /> 
      <IndexRedirect to="1" /> 
     </Route> 
    </Route> 
</Router>

所以路由器是負責哪一個組件內Container渲染。 Container將連接到終極版，並將其應用於使用下面的函數獲取它的孩子們的道具：

renderChildren() { 
    return React.Children.map(this.props.children, 
     (child) => React.cloneElement(child, { 
      ...this.props 
     }) 
    ); 
}

在Component1我已經定義proptypes：

Component1.propTypes = { 
    prop1: PropTypes.number, 
    prop2: PropTypes.func.isRequired 
}

如果我把一個debugger聲明渲染功能的Component1和Container,Component1實際上會先呈現，並且不會有任何道具傳遞給它。這發出警告說prop2是必需的。在此之後，Container被渲染，然後Component1再次與道具和警告消失。

如何避免這些警告？我打破了最佳做法嗎？

來源

2017-03-08 Dave

正確的語法是：

Component1.propTypes = { 
    prop1: React.PropTypes.number, 
    prop2: React.PropTypes.func.isRequired 
}

來源

2017-03-08 06:14:07 Ved

我想我並沒有包括它的問題，但我導入PropTypes：'進口反應，{} PropTypes從「反應」;'我100％肯定這不是問題的原因。 – Dave

路由器呈現意想不到的訂單成分，並導致proptype警告

回答

相關問題