Propsって?

親コンポーネントから渡されたプロパティ（値）
直接外部のStateに接続する場合にはPropsで受け取る
不変のデータ
変更不可
親から渡される

Props は、一般的に、親コンポーネントから子コンポーネントに渡される値。

###記述方法

今回説明するページの構造

OyaComponent.jsx
 - ChildComponent.jsx

親Componentに値を管理するStateがある。
そのStateの値を子Componentで表示させる。

では早速。

####親Component

OyaComponent.jsx


import React, { useState } from "react";
import TextField from "@material-ui/core/TextField";

function OyaComponent (props) {

const [allData, SetAllData] = useState({
    nickname: "値１",
    txtData:"値2"
  });

  return (
    <ChildComponent data={allData}/>
  )
}

###子Component

ChildComponent.jsx


import React from 'react';

function ChildComponent(props) {
  return (
    //それぞれに値1,値２が表示される
    <p>{props.data.nickname}</p>
    <p>{props.data.txtData}</p>
  )
}

###渡された値の確認方法

consol.log(props);