ReactJS - 小道具またはプロポタイプ？

Question

私がオープンソースから小道具について読んでいるとき、私はpropsとpropTypesを使って親から得たプロパティを宣言しています。両者の違いは何ですか？どちらを使うべきですか？例えば

：

小道具source code

export default class App extends Component { 
    props: { 
    children: Children 
    }; 

    render() { 
    return (
     <div> 
     {this.props.children} 
     </div> 
    ); 
    } 
} 

propTypessource code

Answer 1

export default class Board extends Component { 
    static propTypes = { 
    getLists: PropTypes.func.isRequired, 
    moveCard: PropTypes.func.isRequired, 
    moveList: PropTypes.func.isRequired, 
    lists: PropTypes.array.isRequired, 
    } 
    ... 
} 

小道具が反応クラスに送信された実際の特性です。 propTypesは、クラスが受け取るはずのプロパティを定義するために使用されます。だからあなたは両方を使用する必要がありますMore about props

プロンプトについての素晴らしいことは、あなたが何をすべきかを定義するので、正しいタイプが確実に送信されるようにすることです...意味することは、コンソールに、 。 More about propTypes

Answer 2

差である：

小道具：

子コンポーネントに親コンポーネントからのデータ/関数を渡すために使用されます。 Objectになります。親コンポーネントから送信するすべての値がこの部分になります。このようになります。そして、あなたの小道具オブジェクト、あなたが親a='1' b={this.b.bind(this)} c={}から3つの値を渡しているとしましょう：

{ 
    ... 
    a: ..., 
    b: ..., 
    c: ..., 
    ... 
} 

proptypes：かどうか、あなたは親コンポーネントから渡されたpropsの種類を指定するために使用

array, function, object, string, number etcとなります。あなたは子コンポーネントで小道具の種類を定義すると、各：それは開発プロセスに役立ちますどのように

static propTypes = { 
    a: PropTypes.string, 
    b: PropTypes.func, 
    c: PropTypes.object, 
} 

：これらの値は、子コンポーネントで、親から渡されますが、このようなproptypesを定義することができると言うことができますその値がチェックされ、指定された型以外の値を受け取った場合、警告をスローします。

さらに重要なことは、チームが同じ作業をしているときにも、他の人に役立つことです。基本的には、これらは親コンポーネントから渡す値であり、これらは値のタイプなので、親コンポーネントでこれらの詳細について確認する必要はありません。props

Answer 3

小道具は、親によって反応コンポーネントに送信される不変データです。関数がJavascriptのファーストクラスの市民であるため、関数である可能性があることに注意してください。

propタイプを使用してprop値のタイプを検証します。これは、支配価値のタイプを定義するのに役立ちます。