PrimeReact：悬停时更改菜单栏项目的背景颜色

Question

悬停时我无法更改菜单项颜色如您所见，悬停时颜色仅显示在角落，而不显示在实际项目上。

这是我的 css 代码：

/*Menubar*/
.p-menubar {
    background-color: var(--primary) !important;
}
.p-menu-list {
    background-color: var(--primary) !important;
}
.p-menuitem {
    background-color: var(--primary) !important;
}
.p-menu-list:hover {
    background-color: #000 !important;
}
.p-menuitem:hover {
    background-color: #000 !important;
}
.p-menuitem-text, .p-menuitem-icon, .p-submenu-icon {
    color: var(--text-primary) !important;
}

Answer 1

如果我没理解错的话，你需要这个

.p-menuitem-active a {
    background: #000 !important;
}

或者这取决于你是想 hover 还是展开

.p-menuitem-link:hover {
    background-color: #000 !important;
}

PrimeReact：悬停时更改菜单栏项目的背景颜色

PrimeReact: change background color of Menubar items when on hover

css

reactjs

primereact