Tweet

Pocket

コンポーネントに情報を渡すためにPropsを指定します。
渡す項目を明確に指定する場合、必須の項目、任意（省略可能）な項目をどのように記載するメモ

コンポーネントで使用するPropsを指定

function Home(props: HomeProps) {
    return( ... );
};
export default Home;

コンポーネントに渡すPropsの方を指定する場合は、
他の指定と同じようにコロンの後ろに型名を記載します。
上記の例では「HomeProps」を型として指定しています。

Propsの型を定義

type HomeProps = {
    pram1: string,
    pram2: string
};

type で型名称を指定して、その中に所有する項目を指定します。
上記の場合、pram1, param2 どちらも指定必須となっています。

Propsに省略可能の項目を指定

type HomeProps = {
    param1: string,
    param2?: string
};

省略をしたい項目に対しては、項目名の後ろへ「?」をつけます。
上記の場合、param1 は必須、param2 は任意の項目となります。

関連記事 :

[React] Routerによるアクセス先の指定 [React] 導入バージョンの確認