raect-native学习(3)

    xiaoxiao2021-03-25  117

    react-native实现Navigator Back回退(Android)

    直接上解决代码:      我们会用到一个叫做BackAndroid的Component,见名知意,就不多说了。下面说到的Component都是指Navigator切换的路由Component。注意别忘了在import中添加BackAndroid。

    在Component的构造方法中,持有一个func的回退方法。

    constructor(){   super();   this.handleBack = this.handleBack.bind(this); }

     然后在界面Component完成加载后,注册监听事件。

    componentDidMount () {   BackAndroid.addEventListener('hardwareBackPress', this.handleBack) }

      在Component被卸载的时候注销监听。

    componentWillUnmount () {   BackAndroid.removeEventListener('hardwareBackPress', this.handleBack) }

      然后静静地监听就好了...

    handleBack(){   var navigator = this.navigator;   if (navigator && navigator.getCurrentRoutes().length > 1) {     navigator.pop();     return true;   }else{     return false;   } }

      如果想在首页双击back退出应用程序的话,可以这么做:

    var firstClick = 0;handleBack(){   var navigator = this.navigator;   if (navigator && navigator.getCurrentRoutes().length > 1) {     navigator.pop();     return true;   }else{     var timestamp = (new Date()).valueOf();     if(timestamp-firstClick>2000){       firstClick = timestamp;       GSUtil.showToast('再按一次退出');       return true;     }else{       return false;     }   } }
    转载请注明原文地址: https://ju.6miu.com/read-20958.html

    最新回复(0)