镭'：悬停'不起作用

Question

在我第一次实现 Radium 时，我正在尝试一个简单的“:hover”。这是我的...

import React from 'react'
import Radium from 'radium'

@Radium
export default class ResSideNav extends React.Component {
  render() {
    const style = {
      navItem: {
        backgroundColor: '#2c80b8',

        ':hover': {
          backgroundColor: '#3A94CF'
        }
      }
    };

    return(
      // navItems defined elsewhere
      <div style={ style.navContainer }>
        {navItems.map((item, i) => <div key={ i } style={ style.navItem }>
                                    { item.name }</div>)}
      </div> 
    );
  }
};

我在服务器或控制台中没有收到任何错误，只是完全没有 :hover 状态事件。 Webpack 没有给我任何错误，因为我已经设置了我的 .babelrc 和 Webpack 配置文件来读取装饰器语法。

需要说明的是，还有其他样式和元素在起作用，但这是一个经过修饰的胖子示例。谢谢

Answer 1

以防万一有人遇到这个...

我的问题是即使在安装 babel-plugin-transform-decorators-legacy 之后 babel 仍然没有读取 es6 中的装饰器运算符所以我只是：

class ResSidenav extends React.Component {
 // ...
export default Radium(ResSidenav);

不确定为什么这不起作用...

镭'：悬停'不起作用

Radium ':Hover' not working

javascript

reactjs

radium