First, why use prop-types
When people develop, when people use their own definition of the components, it is possible to pass the wrong type of situation, and on their components plus prop-types, he can check the parent component came props, adding parent components want to pass a string type '3', and sends a digital type 3, if there is no type checking system will not give tips, but after checking with the type, then the console will give you a type of delivery errors tips. So you can quickly find errors in their work.
Second, the study documents
https://www.npmjs.com/package/prop-types npm official website
https://reactjs.org/docs/typechecking-with-proptypes.html REACT official
Third, installation and introduction
//安装
npm install prop-types --save
//引入
import PropTypes from 'prop-types';
Fourth, it can detect the type of
optionalArray: PropTypes.array,
optionalBool: PropTypes.bool,
optionalFunc: PropTypes.func,
optionalNumber: PropTypes.number,
optionalObject: PropTypes.object,
optionalString: PropTypes.string,
optionalSymbol: PropTypes.symbol,
optionalBool: PropTypes.bool,
optionalFunc: PropTypes.func,
optionalNumber: PropTypes.number,
optionalObject: PropTypes.object,
optionalString: PropTypes.string,
optionalSymbol: PropTypes.symbol,
Fifth, the use isRequired must set the property value passed to
static propTypes={
name:PropTypes.string.isRequired
}
Sixth, the use defaultProps
TodoItem.propTypes = {
test:Proptypes.string.isRequired,
item : Proptypes.string,
deleteItem: Proptypes.func,
index : Proptypes.number
}
TodoItem.defaultProps = {
test:'hello'
}