CSS-модуль Gatsby Component Props

Я пытаюсь использовать реквизит в качестве класса в стилях, используя модуль Gatsby CSS

import styles from './header.module.sass'

const Header = props => (
    <header className={styles + props.position}>

Я знаю, что этот код не работает, он просто показывает, чего я хочу достичь.

В моем макете я вызываю компонент заголовка, подобный этому, поэтому заголовок затем будет отображаться с использованием определенного CSS для вершины. Я знаю, что легко справлюсь без модуля CSS, но дело не в этом.

<Header position="top" />

Любая помощь или совет?


reactjs css gatsby
person Community    schedule 01.03.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

если props.position = 'top' и вы хотите установить className={styles.top} через реквизиты, вы можете сделать это так:

import styles from './header.module.sass'

const Header = props => (
<header className={styles[props.position]}>
person tekniskt    schedule 01.03.2018