tamakipedia

フロントエンドエンジニア。Typescriptもう特訓中です。一日の振り返りや学んだことをちょっとずつ吐いています。

JSX 型にドット記法を使用する

reactのドキュメントにあった記法についてメモ

ドット記法

以下のように、オブジェクトの中身を "." で呼び出せること。

const obj = {
  a: "a",
  b: "b",
  cfanc: () => {}
};

obj.a // "a"

reactでも同じように

const SomeComponent = {
  Foo: () => <div>ふぅ〜</div>,
  Bar: () => <div>ばぁ〜</div>
};

export default function App() {
  return <SomeComponent.Foo />;
}

//   return <SomeComponent.Bar /> とすることが可能  

ドキュメント

ja.reactjs.org