反应导航栏按钮，如何设置活动

Question

我希望我的侧边栏按钮在访问其导航的页面时更改颜色。

Answer 1

I had this problem before and :active didn't help that much because it returns to its original css once I click other part in my page.

What you should do is create a class for your selected navbar button

.current_active_navbar {
   background-color: $main-red;
}

then in your js, create a condition that will apply the .current_active_navbar to navbar based on your current URL. You can get your current URL through this window.location.href

So let's say your current url is localhost:3000/timer then you can have your condition like this

if(window.location.href.split("/")[3] === "timer")

Answer 2

我不是用CSS自己太优秀了，但这个做了解释它的一个不错的工作。