怎么在react的jsx中使用activeClassName改变上层或者其他标签的class呢？

Question

1里的li标签class使用active可以正常显示样式但是把li标签替换成NavLink无效，
直接在NavLink里设置样式（图中2的形式）只能改变a标签（转换成html后的a标签）的class而不是li标签，所以效果也不能实现。

我想根据路由比如to=“/”这个地址来让li标签里的className变成active。怎么才能做到呢？css里实在有些复杂，直接去改css不知道怎么改，有没有react里可以实现的方法，或者能做到的思路？
非常感谢大佬们。

Answer 1

className={{active: this.props.history.location.href === '/'}}