react native android 应用状态(前端或后台)的判断
当Android应用程序被暂时放到了后台,或者又重新回到前台,是否有相应的事件可以处理到?
例如,当你的应用暂时放到了后台,是否应该做出一些操作,暂时保存界面上的数据?
可以参考:https://github.com/wix/react-native-navigation/issues/839
官方文档:https://facebook.github.io/react-native/docs/appstate.html
官方示例代码:
import React, {Component} from 'react'
import {AppState, Text} from 'react-native'
class AppStateExample extends Component {
state = {
appState: AppState.currentState
}
componentDidMount() {
AppState.addEventListener('change', this._handleAppStateChange);
}
componentWillUnmount() {
AppState.removeEventListener('change', this._handleAppStateChange);
}
_handleAppStateChange = (nextAppState) => {
if (this.state.appState.match(/inactive|background/) && nextAppState === 'active') {
console.log('App has come to the foreground!')
}
this.setState({appState: nextAppState});
}
render() {
return (
<Text>Current state is: {this.state.appState}</Text>
);
}
}
做法是:引用AppState
import { AppState } from 'react-native';
在组件的componentDidMount事件中,增加以下代码
componentDidMount() {
console.log('componentDidMount================');
AppState.addEventListener('change', (state) => {
if (state === 'active') {
console.log('state active');
} else if (state === 'background') {
console.log('background');
} else if (state === 'inactive') {
console.log('inactive');
}
});
}
App States
active - 该应用程序在前台运行
background - 该应用程序正在后台运行。用户是:
在另一个应用中
在主屏幕上
[Android]在另一个Activity(即使它是由您的应用程序启动)
inactive - 这是在前景和背景之间转换时以及在处于非活动状态期间发生的状态,例如进入多任务处理视图或来电时
运行效果

react native android 应用状态(前端或后台)的判断的更多相关文章
- react-native —— 在Windows下搭建React Native Android开发环境
在Windows下搭建React Native Android开发环境 前段时间在开发者头条收藏了 @天地之灵_邓鋆 分享的<在Windows下搭建React Native Android开发环 ...
- React native android 最常见的10个问题
这里逐条记录下最容易遇到的React native android 相关case: 1. app启动后,红色界面,unable load jsbundle : 解决办法:一般来说就是,你是用dev-s ...
- react-native —— 在Mac上配置React Native Android开发环境排坑总结
配置React Native Android开发环境总结 1.卸载Android Studio,在终端(terminal)执行以下命令: rm -Rf /Applications/Android\ S ...
- React Native & Android & iOS & APK
React Native & Android & iOS & APK https://play.google.com/apps/publish/signup/ $ 25 bui ...
- Windows 10 & React Native & Android
Windows 10 & React Native & Android https://facebook.github.io/react-native/docs/getting-sta ...
- React Native & Android & iOS
React Native & Android & iOS React Native & Android & iOS https://facebook.github.io ...
- React Native Android原生模块开发实战|教程|心得|怎样创建React Native Android原生模块
尊重版权,未经授权不得转载 本文出自:贾鹏辉的技术博客(http://blog.csdn.net/fengyuzhengfan/article/details/54691503) 告诉大家一个好消息. ...
- React Native Android启动白屏的一种解决方案上
我们用RN去开发Android应用的时候,我们会发现一个很明显的问题,这个问题就是启动时每次都会有1~3秒的白屏时间,直到项目加载出来 为什么会出现这个问题? RN开发的应用在启动时,首先会将js b ...
- React Native Android 环境搭建
因为工作需要,最近正在学习React Native Android.温故而知新,把学习的内容记录下来巩固一下知识,也给有需要的人一些帮助. 需要说明的是,我刚接触React Native也不久,对它的 ...
随机推荐
- AngularJS学习——价格计算器
利用AngularJs实现价格计算器,总价满100免运费.(熟悉$watch的使用)
- 9.python爬虫--pyspider
pyspider简介 PySpider:一个国人编写的强大的网络爬虫系统并带有强大的WebUI.采用Python语言编写,分布式架构,支持多种数据库后端,强大的WebUI支持脚本编辑器,任务监视器,项 ...
- vs 统计有效代码行数
1.Visual Studio中,crtl+Shift+F,输入b*[^:b#/]+.*$ ,查找范围:选择整个解决方案,查找选项:使用正则表达式,文件类型:*.cs;*.cshtml 选择查找全部
- iOS tag的使用
一.添加标记 (标记不能为0) UIButton *backBtn = [[UIButton alloc] initWithFrame:CGRectMake(,,,)]; backBtn.backgr ...
- Java进行http请求工具类代码(支持https)
package com.guyezhai.modules.utils; import java.io.BufferedReader; import java.io.DataOutputStream; ...
- 【51NOD-0】1130 N的阶乘的长度 V2(斯特林近似)
[算法]数学 [题解]斯特林公式: #include<cstdio> #include<algorithm> #include<cmath> using names ...
- 【51NOD-0】1081 子段求和
[算法]树状数组(区间和) [题解]记得开long long #include<cstdio> #include<cstring> #include<algorithm& ...
- 9.0docker的数据管理
dopcker容器的数据卷 为容器添加数据卷 sudo docker run -v ~/container data:/data -it ubuntu /bin/bash 查 ...
- python自动开发之第二十五天
一.组合搜索 参考: http://www.cnblogs.com/ccorz/p/5985205.html 二.JSONP 1.在同源策略下,在某个服务器下的页面是无法获取到该服务器以外的数据的,但 ...
- HTML5 audio标签自制音乐播放器
相关技能 HTML5+CSS3(实现页面布局和动态效果) Iconfont(使用矢量图标库添加播放器相关图标) LESS (动态CSS编写) jQuery(快速编写js脚本) gulp+webpack ...