驗證父級和子級組件上的propType？

我應該向父組件及其子組件添加propTypes嗎？驗證父級和子級組件上的propType？

比如我有一個是通過3個道具<Header modal={this.state.modal} lives={this.state.lives} score={this.state.score} />組件和我確認，像這樣：

const Header = function(props) { 
    if (props.modal) { 
    return (<Logo logo={logo} />); 
    } else { 
    return (
     <div> 
     <Lives lives={props.lives} /> 
     <Score score={props.score} /> 
     </div> 
    ); 
    } 
}; 
Header.propTypes = { 
    modal: React.PropTypes.bool.isRequired, 
    lives: React.PropTypes.number.isRequired, 
    score: React.PropTypes.number.isRequired, 
};

正如你可以看到有兩個子組件<Lives lives={props.lives} />和<Score score={props.score} />。我也爲這些組件添加了propTypes。

const Score = function(props) { 
    return (
    <p className="score score--right"> 
     {props.score} pts 
    </p> 
    ); 
}; 
Score.propTypes = { 
    score: React.PropTypes.number.isRequired, 
};

因此，它是多餘的是檢查同樣的道具兩次？這是過於複雜的事情（使我的代碼更難以管理）。

來源

2016-11-21 de__bug

在我看來，您應該在每個組件中驗證propTypes，無論它是否在父組件中進行了驗證。這樣想：如果一個組件使用的道具，你應該驗證

一個發生反應的主要優點是成分複用性類型的道具。即使在你的情況下，Score目前可能只能被Header使用，你稍後可能會發現它在其他地方很有用，Score從其他來源獲得score，你應該確保它接收到正確的類型。

如果您擔心在生產中這些重複的類型驗證的捆綁大小，有一個bable plugin來幫助。

來源

2016-11-21 22:40:21 xiaofan2406

PropTypes類型定義組件預期的屬性和類型。在父組件和子組件中定義它並不是多餘的，因爲這個想法是Score組件是一個表示組件，如果需要，可以在其他地方重用。

因此，確保您的分數組件正在接收預期的屬性是一個很好的做法。它還使您意識到組件對外部數據的「依賴關係」。

來源

2016-11-21 22:36:26

驗證父級和子級組件上的propType？

回答

相關問題