TypeScript + Material-UIでの忘備録

出てきた予備知識

Theme

material-UIの型定義でこれをつけておくとエディタでの補助が効く機能らしい，つけといて損はない感じ．

createStyles, makeStyles

Reactのフックを作るため必要

実装方法

import { createStyles, Theme, makeStyles } from "@material-ui/core/styles";

でmaterial-UIから必要なものをインポート．その後

const useStyles = makeStyles((theme: Theme) =>
    createStyles({
	{*/ ここにstyleを記入
	ex inline: {
            display: "inline",
        },
	*/}
})
);

でスタイルを定義する．その後コンポーネント内でuseStylesをclassesなどに置き換え，必要に応じてclasses.inlineなどで適応をする．