反应道具类型:现有道具类型中可重用的验证器

时间:2019-07-28 09:13:06

标签: javascript reactjs react-proptypes

在React中使用prop-type时,有没有一种方法可以从现有的验证器中创建可重用的验证器


示例:验证标题包含标题和图标的“标题”对象:

Component.propTypes = {
  header: PropTypes.shape({
    title: PropTypes.string.isRequired,
    icon: PropTypes.element,
  })
}

我们可以编写一个可重用的isHeader函数

Component.propTypes = {
  header: isHeader
}

2 个答案:

答案 0 :(得分:1)

您可以使用类似的内容:

export const shared = {
  header: PropTypes.shape({
    title: PropTypes.string.isRequired,
    icon: PropTypes.element,
  })
}

然后:

Component.propTypes = {
  {...shared}
}

答案 1 :(得分:1)

您应该能够像这样创建可重用类型:

const myReusableHeader = PropTypes.shape({
  title: PropTypes.string.isRequired,
  icon: PropTypes.element,
})

然后您可以像这样在组件中使用它:

Component.propTypes = {
  header: myReusableHeader
}