react native 安卓Back键的处理
来源:互联网 发布:java 函数 编辑:程序博客网 时间:2024/06/08 05:15
根据文档,安卓back键的处理主要就是一个事件监听:
class App extends React.Component { componentWillMount() { if (Platform.OS === 'android') { BackAndroid.addEventListener('hardwareBackPress', this.onBackAndroid); } } componentWillUnmount() { if (Platform.OS === 'android') { BackAndroid.removeEventListener('hardwareBackPress', this.onBackAndroid); } } onBackAndroid = () => { const nav = this.navigator; const routers = nav.getCurrentRoutes(); if (routers.length > 1) { nav.pop(); return true; } return false; }; ……}
例子:“再按一次退出应用”
常有这种需求:按下back键以后,弹出一个toast,然后在一定时间内再按一次,才退出应用。这个代码就可以这样写:
onBackAndroid = () => { if (this.lastBackPressed && this.lastBackPressed + 2000 >= Date.now()) { //最近2秒内按过back键,可以退出应用。 return false; } this.lastBackPressed = Date.now(); ToastAndroid.show('再按一次退出应用'); return true; };
还有一种情况,我们在监听函数中不能决定是否要调用默认行为,要等待一个异步操作之后才调用默认行为,此时可以通过第二种办法:
使用BACKANDROID.EXITAPP()
来退出应用。
例子:在退出应用之前保存数据
写法1:
onBackAndroid = () =>{ saveData().then(()=>{ BackAndroid.exitApp(); }); return true; }
在监听函数中,我们开始异步事件,并直接return true。此时默认行为不会被调用。当保存完毕后,我们调用exitApp(),触发默认行为,退出应用。
写法2:
onBackAndroid = async () =>{ await saveData(); BackAndroid.exitApp(); }这里我们用了async函数,async 函数总是返回一个Promise,Promise作为一个对象,也被认为是一个“真值”,所以这种情况下默认行为总是不会被调用。当保存完毕后,我们调用exitApp(),触发默认行为,退出应用。
根据当前界面决定作何动作
有时候我们有这样的需求:当用户处于某些界面下时,back键要做特殊的动作,如:提示用户是否要保存数据,或者解锁界面禁止back键返回等等。此时,最佳实践是在route或route中对应的Component上保存关于如何处理back键的信息:
onBackAndroid = () => { const nav = this.navigator; const routers = nav.getCurrentRoutes(); if (routers.length > 1) { const top = routers[routers.length - 1]; if (top.ignoreBack || top.component.ignoreBack){ // 路由或组件上决定这个界面忽略back键 return true; } const handleBack = top.handleBack || top.component.handleBack; if (handleBack) { // 路由或组件上决定这个界面自行处理back键 return handleBack(); } // 默认行为: 退出当前界面。 nav.pop(); return true; } return false; };
阅读全文
0 0
- React-Native 安卓back键处理
- react native 安卓Back键的处理
- React-native 安卓模拟器的刷新
- 安卓Back键的处理·基本+高级篇
- React Native物理back键详解
- react native Back 按钮封装
- React Native之调用安卓的原生控件recyclerview
- react-native中运用阿里的字体Iconfont(安卓)
- react-native cookie 的处理
- React Native学习安卓手机上的返回键BackAndroid
- React Native学习安卓手机上的返回键BackAndroid
- React Native学习安卓手机上的返回键BackAndroid
- React Native(七):Android双击Back键退出应用
- React-native自定义安卓组件
- React Native区分安卓/iOS平台
- react-native 安卓打包流程
- React-native windows 安卓 打包
- 关于React Native打包安卓项目
- Android Paint之PathEffect详解
- .net实现app接口的Demo简单教程
- 刚创建的maven项目,pom.xml的第一行就报错
- JSONObject 遍历各个字段值
- 贝塞尔曲线实例讲解
- react native 安卓Back键的处理
- [Motion]MPU9250的基本性能参数
- 5-21 求特殊方程的正整数解 (15分)
- Caffe C++API 提取任意一张图片的特征系列二----MemoryData
- 实现1+2+3+...+n。要求不能使用乘除法,for,while,if,else,switch,case,等关键字及条件判断语句。
- c++面试题
- phpstorm 配置 xdebug调试工具
- 写给那些傻傻的,想做服务器开发的应届生
- linux学习