Как мне запрограммировать кнопку возврата панели навигации в реагировать на встроенную навигацию?

Question

пытается программно отключиться от соединения с socket.io после нажатия кнопки назад навигационной панели.

Я пробовал обрабатывать нажатия кнопок в соответствии с документацией Wix GitHub здесь: https://wix.github.io/react-native-navigation/#/docs/topBar-buttons?id=handling-button-press-events

export default class Lobby extends React.Component {
  static options(passProps) {
    return {
      topBar: {
        leftButtons: {
          id: "backButton"
        }
      }
    };
  }

  constructor(props) {
    super(props);
    this.state = {
      username: "",
      queue: []
  };
    Navigation.events().bindComponent(this);
  }
// for the parameter I've tried: `{buttonId}`, `{backButton}`,`"backButton"`, `backButton`
      navigationButtonPressed(backButton) {
        const socket = io("http://172.31.99.250:3000");
         socket.emit("leaveLobby", this.state.username);
      }

Ничего из функции обработчика не происходит. приложения просто возвращаются на предыдущую страницу без отправки события socket.io

Answer 1

вы должны использовать этот метод следующим образом, чтобы запустить вашу функцию

navigationButtonPressed({ buttonId }) {

let isRTL = this.checklanguage();

switch (buttonId) {
  case 'menuBtn':     // id of your navigation item
    this.toggleSideMenu(isRTL);    // func to run  
    break;
  case 'logoutBtn':
    this.logoutHandler();
    break;

  default:
    break;
}

}

ваш код содержит ошибку, так как он работает на Object и вы не сделалине включите его в свой код

// for the parameter I've tried: `{buttonId}`, `{backButton}`,`"backButton"`, `backButton`
  navigationButtonPressed(backButton) {
    const socket = io("http://172.31.99.250:3000");
     socket.emit("leaveLobby", this.state.username);
  }

попробуйте мой

Answer 2

просто используйте как это в

реагировать на родную навигацию v2

   import {BackHandler} from 'react-native'

   ...


    constructor(props){
        super(props)
        Navigation.events().bindComponent(this)
    }

    componentDidDisappear() {
        BackHandler.removeEventListener('hardwareBackPress',this.handleBackPress);
    }

    componentDidAppear() {
        BackHandler.addEventListener('hardwareBackPress', this.handleBackPress);
    }

    handleBackPress = () => {
        this.moveToHome()
        return true
    }

    moveToHome = () => {
        Navigation.mergeOptions("maintabs", {
            bottomTabs: {
                  currentTabIndex: 0,
            }
      })
    }
...