在 React 类组件中正确放置样式变量答案

【问题标题】：Correct placement of style variable in React class component在 React 类组件中正确放置样式变量
【发布时间】：2019-01-10 19:38:11
【问题描述】：

有人可以评论一下 React 在放置样式变量之间的区别：

在类组件函数之外，但在组件脚本中，与
在组件主体中，但在 return 语句之外，与
在 return 语句中，但在渲染函数之外，与
在渲染函数中

每一个都可以，但我不明白为什么一个可能比另一个更可取。

export default class MyComponent extends Component {
    putStyleHere = { color: '#eee' }
    render() {
        const orPutStyleHere2 = { color: '#eee' }
        return (
            const orPutStyleHere3 = { color: '#eee' }
            <p style={putStyleHere}>Hello, world!</p>
        )
    }
}
const orPutStyleHere4 = { color: '#eee' }

提前致谢。

【问题讨论】：

标签： css reactjs styles

【解决方案1】：

最好在渲染函数之外有常量，这样它们就不会在每次渲染时都被重新声明/重新分配[只要 const 值不会改变，就像你的场景中的情况一样]

【讨论】：