javascript - React 中特定样式的 HTML 标签

Question

我有一张 table ，我正在尝试设计它的样式。这就是我到目前为止所做的:

                <tr>
                    <th> </th>
                    <th style={tstyle}>Canada</th>
                    <th style={tstyle}>US</th>
                    <th style={tstyle}>Total</th>
                </tr>

然后:

const tstyle = {
border: '1px solid #dddddd',
padding: '8px',
};

这很好用，但我确信这是一种更好的方法，无需重复 style={tstyle}。 我试过这样做:

const styles = () => createStyles({
th: {
    color: 'blue',
},

没有错误，但无法正常工作。

Answer 1

create-react-app 在最新版本中支持 CSS 模块，检查一下 ;)

https://facebook.github.io/create-react-app/docs/adding-a-css-modules-stylesheet

Styled Components 也是一个不错的选择。