在工作当中,我们进行传参一定要对象传递的数据进行校验,如果不校验的话,大量的数据传递,会造成混乱,业务逻辑也没办法保证。
PropTypes 提供一系列验证器,可用于确保组件接收到的数据类型是有效的。在本例中, 我们使用了 PropTypes.string。当传入的 prop 值类型不正确时,JavaScript 控制台将会显示警告。出于性能方面的考虑,propTypes 仅在开发模式下进行检查。
比如现在我们加入一个avname的属性,并放入JSX中,就算不传递这个值也不会报错的
render() { return ( // 点击事件 this.props.content 子接 <li onClick = {this.handleClick}> {this.props.avname}--为你服务 : {this.props.content} </li> ); }如果 在校验的时候加上关键字isRequired,这事 父组件如果不传过来参数,这里就会报错,我们就需要在父组件里进行传参 或者 在子组件中使用defalutProps 默认值
//若父组件 不传值这里写成默认的 xiaojiejieItem.defaultProps = { avname:"小庄" }注意官网还有很多校验其他数据类型的方法,这里不一一举例 https://zh-hans.reactjs.org/docs/typechecking-with-proptypes.html#gatsby-focus-wrapper