親から子へ値を渡す props

JSX で HTML のように属性値を渡すとkeyref(React が扱う値)以外はpropsとして子コンポーネントに渡せます。

です。

const Child = props => {
  return <p>{props.text || "default text"}</p>;
};

const App = () => {
  return (
    <div className="App">
      <Child text="props text" />
      <Child />
    </div>
  );
};

Childtext属性を使っているので、親が使うときにtext属性を置いてあげるとその値を使うことができます。ですが、この値はが必ず渡されるという保証はありません。
予期しない動作にならないように、子ではフォールバック値が使われるように|| "default text"のように設定しておくと安心です。