CSS для компонента массива поля в Redux-форме

Question

Я использую cssModules для моего проекта, и я пытаюсь загрузить CSS для FieldArray компонента в Redux-форме, делая что-то вроде этого:

.container { 
    display: 'flex', 
    alignItems: 'center', 
    justifyContent: 'space-between', 
    flexDirection: 'row', 
    paddingTop: 15, 
} 

выше мой css для ниже, и это не работает.

<div 
    key={index} 
    styleName="container" 
> 
<Field 
    component={Dropdown} label="" orientation="vertical" 
    name={`${callerIds}.countryId`} fieldArray 
    labelKey="country" valueKey="id" searchable={false} 
    className="row-popup" options={countries} 
/> 
<Field 
    component={TextField} label="" orientation="vertical" 
    name={`${callerIds}.value`} fieldArray 
    className="row-popup" 
/> 
</div> 

это дает мне ошибку, говоря, что propType styleName недопустим. Но я могу использовать тот же стиль с компонентом Field.

, но если я попытаюсь добавить css inline, он отлично работает.

<div 
    key={index} 
    style={{ 
    display: 'flex', 
    alignItems: 'center', 
    justifyContent: 'space-between', 
    flexDirection: 'row', 
    paddingTop: 15, 
    }} 
> 
<Field 
    component={Dropdown} label="" orientation="vertical" 
    name={`${callerIds}.countryId`} fieldArray 
    labelKey="country" valueKey="id" searchable={false} 
    className="row-popup" options={countries} 
/> 
<Field 
    component={TextField} label="" orientation="vertical" 
    name={`${callerIds}.value`} fieldArray 
    className="row-popup" 
/> 
</div> 

Answer 1

.container { 
    ... 
} 

в styles.css,

import styles from 'the-styles-path/styles.css'; 

<div 
    key={index} 
    classNmae={styles.container} 
> 

И убедитесь, что вы WebPack конфигурации CSS-модули правильно, код там должен быть работа

Answer 2

Это не имеет ничего общего с redux-form. Сообщение об ошибке говорит вам правду. styleName не является действительной опорой для <div>.