css - :hover and :focus inline style in React doesn't work

Question

我正在尝试创建一个 const 对象，它应该是一个具有 React 内联样式的按钮，但是 :hover 和 :focus 不起作用。如何在 React 中实现悬停和焦点？

感谢任何帮助!提前致谢。

const Button= {
  background: '#AC003B',
  color: '#fff',
  borderColor: '#AC003B',
  &:hover, &:focus {
    background: '#707070',
    borderColor: '#707070'
  }       
}

Answer 1

我相信你想做的是:

const Button = {
  background: '#AC003B',
  color: '#fff',
  borderColor: '#AC003B',
  '&:hover, &:focus': {
    background: '#707070',
    borderColor: '#707070'
  }       
}