タグ付けされた質問 「react-proptypes」

子をレンダリングする単純なコンポーネントを考える： class ContainerComponent extends Component { static propTypes = { children: PropTypes.object.isRequired, } render() { return ( <div> {this.props.children} </div> ); } } export default ContainerComponent; 質問：子供の小道具のpropTypeはどうあるべきですか？ オブジェクトとして設定すると、複数の子を持つコンポーネントを使用すると失敗します。 <ContainerComponent> <div>1</div> <div>2</div> </ContainerComponent> 警告：失敗したプロップタイプ：に 提供されたchildrenタイプの無効なプロップ、予期された。arrayContainerComponentobject 配列として設定した場合、子を1つだけ指定すると失敗します。 <ContainerComponent> <div>1</div> </ContainerComponent> 警告：失敗したプロップタイプ：ContainerComponentに提供されたタイプオブジェクトの無効なプロップ子、予期される配列。 アドバイスしてください、私は子要素のpropTypesチェックを実行するだけでいいですか？

265 reactjs  jsx  react-proptypes 

コンポーネントに渡されるオブジェクトの配列が実際に特定の形状のオブジェクトの配列であることを確認するために、proptypeを使用する組み込みの方法はありますか？ たぶんこんな感じ？ annotationRanges: PropTypes.array(PropTypes.shape({ start: PropTypes.number.isRequired, end: PropTypes.number.isRequired, })), 私はここで超明白な何かを見逃していますか？このようなことが非常に求められているようです。

244 arrays  reactjs  react-proptypes 

そのサイズの小道具を受け取るコンポーネントがあります。小道具は文字列または数値ex："LARGE"またはのいずれか17です。 React.PropTypesに、propTypes検証でどちらか一方であることを通知できますか？ タイプを指定しないと、警告が表示されます。 prop type `size` is invalid; it must be a function, usually from React.PropTypes. MyComponent.propTypes = { size: React.PropTypes }

244 reactjs  react-proptypes 

React.PropTypesTypeScript Reactアプリケーションでの使用は意味がありますか、それとも「ベルトとサスペンダー」の単なる例ですか？ コンポーネントクラスはProps型パラメーターで宣言されているので、 interface Props { // ... } export class MyComponent extends React.Component<Props, any> { ... } 追加することには本当にメリットがありますか static propTypes { myProp: React.PropTypes.string } クラス定義に？

121 reactjs  typescript  react-proptypes 

クラスを使用せずに、reactの機能的なステートレスコンポーネントでPropTypeを使用するにはどうすればよいですか？ export const Header = (props) => ( <div>hi</div> )

103 javascript  reactjs  react-props  react-proptypes 

PropTypesとFlowは同様のものをカバーしていますが、異なるアプローチを使用しています。PropTypesはランタイム中に警告を出すことができます。これは、サーバーなどから送られる不正な形式の応答をすばやく見つけるのに役立ちます。ただし、Flowは未来のようで、ジェネリックスのような概念は非常に柔軟なソリューションです。また、Nuclideが提供するオートコンプリートは、Flowにとって大きなプラスです。 私の質問は、新しいプロジェクトを始めるとき、どちらが最善の方法かということです。または、FlowとPropTypesの両方を使用することは良い解決策になるでしょうか？両方を使用する場合の問題は、重複するコードを大量に作成することです。これは私が書いた音楽プレーヤーアプリの例です。 export const PlaylistPropType = PropTypes.shape({ next: ItemPropTypes, current: ItemPropTypes, history: PropTypes.arrayOf(ItemPropTypes).isRequired }); export type Playlist = { next: Item, current: Item, history: Array<Item> }; どちらの定義にも基本的に同じ情報が含まれており、データ型が変更された場合は、両方の定義を更新する必要があります。 型宣言をPropTypesに変換するこのbabelプラグインを見つけました。これは解決策かもしれません。

100 reactjs  flowtype  react-proptypes