-1

我正在使用数组在 react-jss 上进行多个扩展,但它不起作用。

const styles = (theme) => ({
flexDisplay: {
    display: 'flex',
    'align-items': 'center'
},
headerBackground: {
    'background-color': defaultTheme.headerBackground
},
headerRowCell:{
    extend: ['headerBackground','flexDisplay'],
    'padding': '0.5em 0.5em',
    'color': theme.secondaryTextColor || defaultTheme.secondaryTextColor,
    'text-transform': 'uppercase',
    height: '48px',
}
});

在此处输入图像描述

这是错误。

4

1 回答 1

0

为了解决这个问题,我们需要创建扩展对象并将对象传递给数组所需的样式对象

const flexDisplay = {
    display: 'flex',
    'align-items': 'center'
};
const headerBackground =  {
    'background-color': defaultTheme.headerBackground
};


const styles = (theme) => ({

headerRowCell:{
    extend: [headerBackground, flexDisplay],
    'padding': '0.5em 0.5em',
    'color': theme.secondaryTextColor || defaultTheme.secondaryTextColor,
    'text-transform': 'uppercase',
    height: '48px',
}
});
于 2020-05-14T15:28:40.307 回答