DEVDEV

React で css propを子コンポーネントに渡す

作成日
2022-11-08
更新日
2022-11-08

前提

  • @emotion/reactmuiを使用しています。

Child Component

tsx
import { SerializedStyles } from '@emotion/react' interface Props { className?: string css?: SerializedStyles } export function Child({ className }: Props) { return ( <div className={className}> </div> ) }

Parent Component

下記のケースでは、some-classemotionで作成されたクラス名が、Child<div className={className}>で適用される。

tsx
<Child className="some-class" css={css` color: red; `} />

Related

TAGS

MUI
emotion

SHARE