如何在 react-router v4 中设置活动链接的样式？

Question

在 react-router v3 中，我们有 activeStyle 和 activeClassName 来设置活动链接的样式

我们可以做这样的事情

  <div id="tags-container">
    {tags.map(t =>
      <Link
        className="tags"
        activeStyle={{ color: 'red' }}
        to={t.path}
      >
        {t.title}
      </Link>
    )}
  </div>

我想知道如何在 v4 中做同样的事情？

原文由 Ramtin Khalatbari 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

使用 NavLink 而不是 Link。它没有记录，但它的工作如您所料。 https://github.com/ReactTraining/react-router/issues/4318

2017 年 5 月 17 日更新：

https://reacttraining.com/react-router/web/api/NavLink

原文由 Sergey Reutskiy 发布，翻译遵循 CC BY-SA 3.0 许可协议