Как узнать состояние видимости sideMenu

У меня есть верхняя панель с кнопкой, которая переключает боковое меню.

Я зарегистрировал действие navigationButtonPressed, как показано ниже.

navigationButtonPressed({ buttonId }) {
    switch (buttonId) {
      case 'sideMenuButtonId':
        Navigation.mergeOptions(this.props.componentId, {
          sideMenu: {
            left: {
              visible: true
            }
          }
        });
        break
      default:
        break
    }
  }

Но в этом случае кнопка делает видимым только sideMenu, и я пытаюсь использовать ее, чтобы она открывала и закрывала меню. Поэтому я заменил приведенное выше переменным подходом, показанным ниже.

var sideMenuVisible = false

navigationButtonPressed({ buttonId }) {
    switch (buttonId) {
      case 'sideMenuButtonId':
        sideMenuVisible = !sideMenuVisible
        Navigation.mergeOptions(this.props.componentId, {
          sideMenu: {
            left: {
              visible: sideMenuVisible
            }
          }
        });
        break
      default:
        break
    }
  }

Что отлично работает, если пользователь использует кнопку только для открытия и закрытия sideMenu, но пользователь также может открывать/закрывать меню, проводя пальцем, чтобы открыть меню, а также касаясь меню, чтобы закрыть его.

Есть ли способ проверить видимость sideMenu, чтобы я мог правильно использовать действие для открытия/закрытия меню по команде?


react-native-navigation react-native-navigation-v2
person Simon    schedule 28.12.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Это можно сделать намного проще. Думаю, вы должны создать его как состояние, потому что компонент должен знать, что он должен быть перерисован при изменении состояния. Так что-то вроде

state = { isOpen: false };

toggleSidebar = () => {
  this.setState({ isOpen: !isOpen })
}

И теперь вы должны вызывать функцию toggleSidebar при нажатии на кнопку

person jonask    schedule 28.12.2018
comment
спасибо йонаск. Да, это, вероятно, лучший подход к обработке нажатия кнопки, но немного большая проблема заключается в эффективном знании видимости sideMenu, поскольку его можно закрыть/открыть несколькими способами. Таким образом, использование переменной для управления состоянием isOpen надежно в половине случаев, когда пользователь использует кнопку/действие, а не использует жесты скольжения или смахивания (например) - person Simon; 28.12.2018
comment
Но все равно звучит так, будто вы должны изменить его на состояние. Вы не увидите никакого эффекта при изменении переменной, потому что ваш компонент не будет перерисовываться. - person jonask; 28.12.2018
comment
@Simon Можете ли вы поделиться со мной кодом для перехода между экраном и ящиком? У меня проблемы с обработкой жестов смахивания. Спасибо. - person Habi; 26.01.2019