如何在 React Native 中检查 App 状态？

React Native 是由 Meta Platforms, Inc 创建的开源 UI 软件框架。它用于开发适用于 Android、Android TV、iOS、macOS、tvOS、Web、Windows 和 UWP 的应用程序，使开发人员能够同时使用 React 框架具有本机平台功能。

在本文中，我们将学习如何在 react native 中检查应用程序状态。

创建 React Native 应用程序：

第 1 步：我们将使用 expo 创建 React Native 应用程序。在终端中使用以下命令安装 expo-cli。

npm install -g expo-cli

第 2 步：使用 expo 创建一个 React Native 项目。

expo init "gfg"

第 3 步：现在使用以下命令转到创建的项目。

cd "gfg"

项目结构：它将如下所示：

检查应用程序状态： AppState 模块可用于确定应用程序的当前状态，无论是在前台还是后台。它还可以在状态更改时通知您。为此，在App.js文件中添加以下代码。

Javascript

import React, { useRef, useState, useEffect } from "react";
import { AppState, StyleSheet, Text, View } from "react-native";
  
const GfGApp = () => {
  const currentState = useRef(AppState.currentState);
  const [state, setState] = useState(currentState.current);
  
  useEffect(() => {
    const handleChange = AppState.addEventListener("change", changedState => {
  
      currentState.current = changedState;
      setState(currentState.current);
    });
  
    return () => {
      handleChange.remove();
    };
  }, []);
  
  return (
    
      GeeksforGeeks React Native App State
      App is in {state} mode
    
  );
};
  
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
  },
});
  
export default GfGApp;

运行应用程序：现在在终端中使用以下命令运行应用程序。

npm run web

输出：