在 react 的 scss 代码中放入 “ content： ”“ ; ” 后，我的链接停止工作

问：

我需要添加指向我的图像的链接。我的意思是，当我单击我的图像时，它应该重定向到特定页面。我尝试使用链接标签（react-router-dom）来做到这一点，但它无法正常工作。

<div className="cate-images">
  <Link to={link}>
    <img src={image} />
  </Link>
</div>

.categories-items {
  position: relative;
  transition: $transition;
  .cate-images {
    a {
      cursor: pointer;
      img {
        box-shadow: 0 0 30px #eee;
        background: #fff;
        border-radius: 0 0 5px 5px;
        position: relative;
        transition: all 500ms ease;
        border-radius: 5px;
      }
    }
  }
  &:before {
    content: "";
    background: -moz-linear-gradient(to top, #000000 0%, rgba(0, 0, 0, 0) 50%);
    background: linear-gradient(to top, #000000 0%, rgba(0, 0, 0, 0) 50%);
    background: -webkit-linear-gradient(
      to top,
      #000000 0%,
      rgba(0, 0, 0, 0) 50%
    );
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: 0;
    border-radius: 5px;
    transition: all 500ms ease;
    z-index: 1;
  }
  &:hover {
    transform: translateY(-10px);
  }
}