使用PropTypes进行类型检查
报错:'date.data.typeName' is missing in props validation
,解决办法:
JavaScript是一门弱类型语言,在灵活开发的同时也更加容易出现bug。在react中有内置了一个组件参数类型检查的机制,这是为了更进一步对参数进行确认,不然参数不对或许只是显示的画面有问题,但程序并不会报错。这在找bug的时间就会花更多的时间。
当然,当你缺少了参数类型验证,页面能正常显示但是会提示需要进行验证。
PropTypes的使用
1.第一步是将react推荐的第三方库进行安装依赖npm install --save prop-types
;
2.将依赖进行引入import PropTypes from 'prop-types'
;
3.进行组件参数验证(代码以官网为例<部分>):
MyComponent.propTypes = {
// 你可以将属性声明为 JS 原生类型,默认情况下
// 这些属性都是可选的。
optionalArray: PropTypes.array,
optionalBool: PropTypes.bool,
optionalFunc: PropTypes.func,
optionalNumber: PropTypes.number,
optionalObject: PropTypes.object,
optionalString: PropTypes.string,
optionalSymbol: PropTypes.symbol,
}
PropTypes
提供一系列验证器,可用于确保组件接收到的数据类型是有效的。当传入的 prop
值类型不正确时,JavaScript 控制台将会显示警告。出于性能方面的考虑,propTypes
仅在开发模式下进行检查。出于性能方面的考虑,propTypes
仅在开发模式下进行检查。