Reactjs 对某些元素使用内置的proptype

我如何重用的propTypes，比如说我的

InputWrapper

中的

input

元素

例如：

class TextInput extends Component {
  static propTypes = {
    theme: PropTypes.oneOf(['themeOne', 'themeTwo']),
    inputProps: ??? // I would like to use the built-in props for React.DOM.input
  }

  render() {
    return <div className={cx(this.props.theme)}>
      <input
        {...this.props.inputProps}
        type="text"
      />
    </div>
  }
}

class TextInput扩展组件{
静态类型={
主题：PropTypes.one（['themeOne'，'themeTwo']），
inputProps:？？？//我想使用React.DOM.input的内置道具
}
render（）{
返回
}
}

---

是否有内置组件的propTypes定义，我可以重复使用？

不确定我是否理解正确，但您可以使用：

class TextInput extends Component {
  static propTypes = {
    theme: PropTypes.oneOf(['themeOne', 'themeTwo']),
    inputProps: PropTypes.shape({
      type: PropTypes.string,
      value: PropTypes.string // etc...
    })
  }

  render() {
    return <div className={cx(this.props.theme)}>
      <input
        {...this.props.inputProps}
        type="text"
      />
    </div>
  }
}

class TextInput扩展组件{
静态类型={
主题：PropTypes.one（['themeOne'，'themeTwo']），
inputProps:PropTypes.shape({
类型：PropTypes.string，
值：PropTypes.string//等。。。
})
}
render（）{
返回
}
}

首先不需要验证输入道具。当您将它们传递给

input

时，它将验证它们

这通常是这样做的：

static propTypes = {
    theme: PropTypes.oneOf(['themeOne', 'themeTwo']),
}

render() {
    const {theme, ...inputProps} = this.props;

    return <div className={cx(theme)}>
      <input
        {...inputProps}
        type="text"
      />
    </div>
}

static propTypes={
主题：PropTypes.one（['themeOne'，'themeTwo']），
}
render（）{
const{theme，…inputProps}=this.props；
返回
}

---

React实际上并不验证传递给本机组件的属性。如果您想验证它们，您必须自己定义验证器道具并重用它们。

确切地说，这是我想要避免的。“手动定义所有可能的道具…”相反，如果可能的话，我想

重新使用
已经内置的道具，谢谢！是的，但是，我们使用的是
eslint
它会产生恼人的警告，这就是为什么我需要这里的定义……）使用
//eslint disable line
等也不是一个选项，那么最好手动定义它们全部或一个子集。@webdeb哪个规则？我的示例不应该对使用未定义的道具产生警告。哦，是的，你是对的，但无论如何，我对内置的道具类型定义更感兴趣。@webdeb我认为你不能访问
输入的道具类型。这意味着您必须自己在一个地方定义它们，然后重用它们。