在React-JSS中使用父伪类修改子类

问题描述

当悬停父元素时,我试图修改子元素的class属性

这是我寻求解决方案的尝试之一。

const useStyles = makeStyles((theme) => ({
  parent: {
    "&:hover child": {
      marginLeft: '0px'
    },child: {
    marginLeft: '-99px'
  }
})

解决方法

使用$引用类名,如下所示:

const styles = {
  parent: {
    '&:hover $child_class_name': {
       marginLeft: '0px'
    },child_class_name: {
    marginLeft: '-99px'
  }
}