tamakipedia

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

【React】最近学んだReact Typescriptの使い方

定数のKeyのユニオン型を作る

const CAR = {
    NAME: "honda",
    COLOR: "red"
}

type K = keyof typeof CAR 
// typeof K = NAME | COLOR

分割代入を別名で

const res = {
  loading: true,
  data : {
    hoge: "hoge",
    fuga: "fuga",
  }
}

// 別名の分割代入
const {data: data2, loading: loading2} = res
console.log(data2)

コンポーネントにパラメーターをまとめて渡す

type HogeProps = {
  hoge: string;
  piyo: string;
};

export const Hoge: React.VFC<HogeProps> = (props) => {
  return (
    <>
      <ChildComponent {...props} />
    </>
  );
};

参考
qiita.com