我非常喜欢
inline CSS pattern in React，决定使用它。
但是，您不能使用：hover和类似的选择器。那么在使用内联CSS样式时，什么是实现亮点悬停的最好的方法？
#reactjs的一个建议是有一个Clickable组件，并使用它像这样：
<Clickable>
<Link />
</Clickable>
可点击具有悬停状态，并将其作为道具传递给链接。然而，Clickable(我实现它的方式)包装在一个div的Link，以便它可以设置onMouseEnter和onMouseLeave到它。这使事情有点复杂，虽然(例如span包装在一个div的行为不同于span)。
有更简单的方法吗？
解决方法
我在同样的情况。真的像在组件中保持样式的模式，但悬停状态似乎是最后的障碍。
我做的是编写一个mixin，你可以添加到你的组件，需要悬停状态。
这个混合将添加一个新的hovered属性到组件的状态。如果用户悬停在组件的主DOM节点上，并将其设置为false(如果用户离开元素)，那么它将设置为true。
现在在你的组件渲染函数中，你可以做：
<button style={m(
this.styles.container,this.state.hovered && this.styles.hover,)}>{this.props.children}</button>
现在每次当悬停状态改变时，组件将重新渲染。
我还创建了一个沙箱仓库，我用来测试这些模式自己。如果你想看一个我的实现的例子，看看它。
https://github.com/Sitebase/cssinjs/tree/feature-interaction-mixin
