Question

如果我希望组件内部的某个组件上的功能道具是可选的，是否更好的做法是使用defaultProps来分配一个noop函数，还是应该检查整个组件，如果该功能是否存在？

例如可选的onChange函数-

<Input />

在Input.js内

if(this.props.onChange){
   this.props.onChange(e)
}

vs。

defaultProps = {
   onChange: () => {}
}

Answer 1

道具是必需的或可选的，它们在prop types中进行了定义。

示例：

Input.PropTypes = {
  onChange: PropTypes.func, // optional
  onBlur: PropTypes.func.isRequired, // required
  exampleProps: 'my example'
}

您不需要在defaultProps中传递noop函数。如果您需要初始化道具（即使用户未在组件中提供），也可以使用默认道具。在上面的示例中，如果用户不提供exampleProps，则道具Input将在exampleProps组件中接收，否则Input组件将获取/设置{{1 }}从提供的exampleProps道具Input中获得。

例如：

exampleProps

输入将exampleProps设置为<Input exampleProps={'my new props'} />。

my new props

输入将exampleProps设置为<Input />。

根据您的要求，您不需要设置noop函数，而是prop类型将其类型设置为函数my example，如果传递的类型不正确，则会抛出错误，提示警告消息。

func

（可选）您也可以阅读此post，以了解更多信息。

处理可选功能道具-defaultProps或check道具是否存在？

1 个答案: