BackHandler في React Native

اكتشاف الضغطات على زر الجهاز الخاص بالتنقل للوراء (back navigation).

Android: اكتشاف الضغطات على زر التنقل للوراء، واستدعاء وظيفة زر الرجوع الافتراضية برمجيًا للخروج من التطبيق في حالة عدم وجود مستمعين (listeners) أو في حالة عدم إعادة أي من المستمعين القيمةَ ‎‎true‎‎.

tvOS: كشف الضغطات على زر القائمة على جهاز التحكم عن بعد الخاص بالتلفاز. (ميّزةٌ لم تُطبَّق بعد: تعطيل وظيفة معالجة زر القائمة برمجيًا لإنهاء التطبيق في حالة عدم إعادة أي من المستمعين القيمةَ ‎‎true‎‎.)

iOS: غير معمول به.

تُستدعى اشتراكات الحدث (event subscriptions) بترتيب عكسي (أي أنّ الأولويّة لآخر اشتراك مسجل) ، وإذا أعاد اشتراك واحد القيمةَ ‎‎true‎‎، فلن تُستدعى الاشتراكات المسجلة السابقة. تحذير: إذا أظهر تطبيقك نافذة شرطيّة (‎‎Modal‎‎) مفتوحة، فلن تنشر واجهة BackHandler أي أحداث (انظر توثيق ‎‎Modal‎‎).

مثال

BackHandler.addEventListener('hardwareBackPress', function() {
  //  this.onMainScreen و this.goBack
  // مثالان فقط، ستحتاج إلى استخدام توابعك الخاصة هنا
  // عادةً ما يُستخدم مكوّن الانتقال هنا للرجوع إلى الحالة السابقة

  if (!this.onMainScreen()) {
    this.goBack();
    return true;
  }
  return false;
});

مثال دورة الحياة

  componentDidMount() {
    this.backHandler = BackHandler.addEventListener('hardwareBackPress', this.handleBackPress);
  }

  componentWillUnmount() {
    this.backHandler.remove()
  }

  handleBackPress = () => {
    this.goBack(); // يعمل بشكل أفضل عندما يكون هذا التابع غير متزامن
    return true;
  }

بديل دورة الحياة

  componentDidMount() {
    this.backHandler = BackHandler.addEventListener('hardwareBackPress', () => {
      this.goBack(); // يعمل بشكل أفضل عندما يكون هذا التابع غير متزامن
      return true;
    });
  }

  componentWillUnmount() {
    this.backHandler.remove();
  }

التوابع

‎‎addEventListener()‎‎

static addEventListener(eventName, handler)

‎‎exitApp()‎‎

static exitApp()

‎‎removeEventListener()‎‎

static removeEventListener(eventName, handler)

مصادر

• صفحة BackHandler في توثيق React Native الرسمي.