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

Question

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

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

每种方法都可以使用，但是我不知道为什么一个人可能比另一个人更可取。

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' }

谢谢。

Answer 1

最好在render函数之外有常量，这样就不会在每个render上都重新声明/重新分配它们[只要const值不会改变，这在您的情况下似乎是这种情况] < / p>