时间戳

首页 > 解决方案 > 如何使用未包含在反应代码中的悬停？

css - 如何使用未包含在反应代码中的悬停？

问题描述

我有以下 CSS 配置

.my-page {
      &-link {
        font-weight: normal;
        color: green;

        &:hover {
          text-decoration: underline;
          font-weight: 500;
          color: #006cbc;
        }
   }
}

当我将它包含在我的反应组件中时，它不会以某种方式包含悬停。

我已将“my-page-link”和“my=page-link-hover”作为类名包含在内，但两者都不起作用。

  <SomeComponent
                      name="here."
                      variant="primary"
                      label="here."
                      className="my-page-link"
                      onClick={this.onEditPaymentMethodModalShow}

                    />

标签： cssreactjshoverless

解决方案

我相信您的 SASS 代码已损坏。您缺少一个右大括号。尝试这个：

.my-page {
  &-link {
    font-weight: normal;
    color: green;

    &:hover {
      text-decoration: underline;
      font-weight: 500;
      color: #006cbc;
    }
  }
}

您还可以使用SASS 操场来确保您得到您所期望的。

希望这可以帮助 ：）

推荐阅读