Nivaech
@Nivaech
фотограф, видеограф, графический дизайнер

Как более элегантно изменить множество значений state на клик?

Есть выпадающее меню, которое открывается на клик. Их четыре штуки. И четыре boolean значения state для каждого из них.
state = {
 sidebarOpenMenu1: false,
 sidebarOpenMenu2: false,
 sidebarOpenMenu3: false,
 sidebarOpenMenu4: false,
}

Если их открывать поочередно, то предыдущее меню не закрывается, и они накладываются друг на друга. Проблема была решена грубым способом - индивидуальным условием, что если какое-то меню активно, то все другие должны закрыться.
handleSidebarOpenMenu1 = () => {
    this.setState({
         sidebarOpenMenu1: !this.state.sidebarOpenMenu1,
         sidebarOpenMenu2: false,
         sidebarOpenMenu3: false,
         sidebarOpenMenu4: false,
    })
}

handleSidebarOpenMenu2 = () => {
    this.setState({
         sidebarOpenMenu1: false,
         sidebarOpenMenu2: !this.state.sidebarOpenMenu2,
         sidebarOpenMenu3: false,
         sidebarOpenMenu4: false,
    })
}
...

И так далее для четырех пунктов меню.
Есть ли более элегантный способ решения проблемы без систематического копирования?
  • Вопрос задан
  • 93 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы