在我第一次实现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配置文件以读取装饰器语法。

需要明确的是,还有其他样式和元素在起作用,但这是一个修剪的胖例子。谢谢。

最佳答案

万一有人碰到这个...

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

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

不知道为什么这不起作用...

10-06 01:02