实现 React Native 再按一次退出

单页面:

...
componentWillMount() {
BackHandler.addEventListener('hardwareBackPress', this.onBackAndroid)
} lastBackPressed =
onBackAndroid = () => {
if (this.lastBackPressed && this.lastBackPressed + >= Date.now()) {
BackHandler.exitApp()
return false
}
this.lastBackPressed = Date.now()
ToastAndroid.show('再按一次退出应用', ToastAndroid.SHORT)
return true
} componentWillUnmount() {
BackHandler.removeEventListener('hardwareBackPress', this.onBackAndroid)
}
...

包含在导航器中:

let lastBackPressed = ;
const defaultStateAction = RootNav.router.getStateForAction;
RootNav.router.getStateForAction = (action, state) => {
if (DEVICE.android && state && action.type === NavigationActions.BACK && state.routes.length === 1) {
if (this.lastBackPressed && this.lastBackPressed + 2000 >= Date.now()) {
BackHandler.exitApp();
return false;
}
this.lastBackPressed = Date.now();
ToastUtil.showToast("再按一次退出应用");
const routes = [...state.routes];
return {
...state,
...state.routes,
index: routes.length - 1,
};
} else {
return defaultStateAction(action, state);
}
};

本博客地址: wukong1688

本文原文地址:https://www.cnblogs.com/wukong1688/p/10959609.html

转载请著名出处!谢谢~~

[RN] React Native 再按一次退出的更多相关文章

  1. [RN] React Native 实现图片预览

    [RN] React Native 实现图片预览 效果预览: 代码如下: 'use strict'; import React, {Component} from 'react'; import {I ...

  2. [RN] React Native 常见基本问题归纳总结

    [RN] React Native  常见基本问题归纳总结 本问题总结涉及到版本为: "react": "16.8.3","react-native& ...

  3. [RN] React Native 关闭所有黄色警告

    [RN] React Native 关闭所有黄色警告 console.ignoredYellowBox = ['Warning: BackAndroid is deprecated. Please u ...

  4. [RN] React Native 下实现底部标签(支持滑动切换)

    上一篇文章 [RN] React Native 下实现底部标签(不支持滑动切换) 总结了不支持滑动切换的方法,此篇文章总结出 支持滑动 的方法 准备工作之类的,跟上文类似,大家可点击上文查看相关内容. ...

  5. [RN] React Native 幻灯片效果 Banner

    [RN] React Native 幻灯片效果 Banner 1.定义Banner import React, {Component} from 'react'; import {Image, Scr ...

  6. [RN] React Native 常用命令行

    [RN] React Native 常用命令行 1.查看当前版本 react-native --version 或 react-native -v 2.创建指定版本的React Native项目 1) ...

  7. [RN] React Native 实现 类似QQ 登陆页面

    [RN] React Native 实现 类似QQ 登陆页面 一.主页index.js 项目目录下index.js /** * @format */ import {AppRegistry} from ...

  8. [RN] React Native 调试技巧

    React Native 调试技巧 一. 安卓模拟器调出Dev Setting 命令 adb shell input keyevent 二.图片不出来时,先运行此命令,再重新 run react-na ...

  9. [RN] React Native 使用 阿里 ant-design

    React Native 使用 阿里 ant-design 实例效果如图: 一.安装 npm install antd-mobile-rn --save npm install babel-plugi ...

随机推荐

  1. Oracle查询所有字段另加两个拼接字段的操作

    Oracle查询所有字段,再加两个字段拼接, select a.*,(SNO||SNAME) from TEST_STUDENT a; 同理,查询所有字段,其中两个字段求和:(SNO和SAGE都是NU ...

  2. mysql 事务的实现原理

    开篇 相信大家都用过事务以及了解他的特点,如原子性(Atomicity),一致性(Consistency),隔离型(Isolation)以及持久性(Durability)等.今天想跟大家一起研究下事务 ...

  3. 引入 ServletContextListener @Autowired null 解决办法

    public class ScheduleController implements ServletContextListener { @Autowired private ScheduleServi ...

  4. Java Base64Utils

    Java Base64Utils /** * <html> * <body> * <P> Copyright 1994 JsonInternational</ ...

  5. Kafka跨集群迁移方案MirrorMaker原理、使用以及性能调优实践

    序言Kakfa MirrorMaker是Kafka 官方提供的跨数据中心的流数据同步方案.其实现原理,其实就是通过从Source Cluster消费消息然后将消息生产到Target Cluster,即 ...

  6. Nginx优化配置,轻松应对高并发

    Nginx现在已经是最火的web服务器之一,尤其在静态分离和负载均衡方面,性能十分优越.接下来我们主要看下Nginx在高并发环境下的优化配置,主要是针对 nginx.conf 文件的属性设置.我们打开 ...

  7. Tomcat配置https加密连接

    配置https安全连接(ssl加密连接) https连接需要用到数字证书与数字签名(MD5算法),网站https连接首先需要申请数字证书,配置加密连接器,浏览器安装证书. 证书运用到RSA技术,RSA ...

  8. CSS文本居中问题

    文本水平居中 水平居中比较简单,将对应的html元素text-align属性值为center,其子元素就会水平居中. 文本垂直居中 单行文本垂直居中 设置文本元素的line-height属性值为元素高 ...

  9. 07-组件通信、slot插槽

    一.组件通信 ① 父 => 子 -- 步骤 1)子组件中通过 props 键接受父组件传值 2)父组件通过 v-bind 向子组件传值 --例子 <!DOCTYPE html> &l ...

  10. 【漏洞复现】Apache Solr via Velocity template远程代码执行

    0x01 概述 Solr简介 Apache Solr 是一个开源的企业级搜索服务器.Solr 使用 Java 语言开发,主要基于 HTTP 和 Apache Lucene 实现.Apache Solr ...