☰

ReactJS でネストされたオブジェクトの PropTypes を検証するにはどうすればよいですか? 質問する

tag-icon • tag-icon reactjs
ReactJS でネストされたオブジェクトの PropTypes を検証するにはどうすればよいですか? 質問する

ReactJS のコンポーネントのプロパティとしてデータ オブジェクトを使用しています。

<Field data={data} />

PropTypes オブジェクト自体を検証するのは簡単だとわかっています。

propTypes: {
  data: React.PropTypes.object
}

しかし、内部の値を検証したい場合はどうすればよいでしょうか? つまり、data.id、data.title などです。

props[propName]: React.PropTypes.number.required // etc...

ベストアンサー1

プロパティを検証するために使用できますReact.PropTypes.shape:

propTypes: {
    data: React.PropTypes.shape({
      id: React.PropTypes.number.isRequired,
      title: React.PropTypes.string
    })
}

アップデート

@Chris がコメントで指摘したように、React バージョン 15.5.0 以降はReact.PropTypesパッケージ に移動されましたprop-types。

import PropTypes from 'prop-types';    

propTypes: {
    data: PropTypes.shape({
      id: PropTypes.number.isRequired,
      title: PropTypes.string
    })
}

より詳しい情報

おすすめ記事