2

当应用程序不使用或处于后台模式时，React Native 是否有函数生命周期正在运行？

当用户不在后台模式下使用应用程序或应用程序时，我需要 react-native 中的函数生命周期正在工作。我想检查数据库以获取通知 componentDidMount 是否正常工作，但用户必须打开应用程序并再次关闭它

我需要一个函数或生命周期始终有效

这是我的通知代码：

import React, { Component } from 'react';
import { View, NetInfo, Image, AppState, DeviceEventEmitter } from 'react-native';
import { Container, Text } from 'native-base';
import { RootNavigator } from './src/root';
import { Provider } from 'react-redux';
import { createStore } from 'redux';
import resducers from './src/reducers/index';
import PushController from'./PushController';
import PushNotification from 'react-native-push-notification';
import PushNotificationAndroid from 'react-native-push-notification';

const store = createStore(resducers);

export default class App extends Component<Props> {
  constructor(Props){
    super(Props);
    this.state={
      connection:null,
    }
    this.handleAppStateChange = this.handleAppStateChange.bind(this);
    this.sendNotification = this.sendNotification.bind(this);
  }

  componentDidMount(){
    AppState.addEventListener('change',this.handleAppStateChange);
  }

  componentWillMount(){
    NetInfo.isConnected.addEventListener("connectionChange",this.handleConnectionChange);
    NetInfo.isConnected.fetch().done((isConnected)=>this.setState({connection:isConnected}));

    PushNotificationAndroid.registerNotificationActions(['Accept','Reject','Yes','No']);
    DeviceEventEmitter.addListener('notificationActionReceived', function(e){
      console.log ('notificationActionReceived event received: ' + e);
      const info = JSON.parse(e.dataJSON);
      if (info.action == 'Yes') {
        alert('Accept');
      } else if (info.action == 'No') {
        alert('Reject')
      }
      // Add all the required actions handlers
    });
  }

  componentWillUnMount(){
    NetInfo.isConnected.removeEventListener("connectionChange",this.handleConnectionChange);
    AppState.removeEventListener('change',this.handleAppStateChange);
  }

  handleConnectionChange=(isConnected)=>{
    this.setState({connection:isConnected});
  }

  handleAppStateChange(appState){
    if(appState==='background'){
      PushNotification.localNotificationSchedule({
        message:'Scheduled notification delay message',
        date:new Date(Date.now()+(2000))
      })
    }
  }
  sendNotification(){
    PushNotification.localNotification({
      message:'You Pushed the notification button',
      title:'My Notification Title',
      ongoing:true,
      vibrate:true,
      playSound:true,
      actions:'["Yes","No"]',
      color:'red'
    })
  }

  handeView(){
    if(this.state.connection!==null && this.state.connection){
      return <RootNavigator />
    }else {
      return <View style={{flex:1, alignItems:"center", justifyContent:"center"}}>
         <Image source={require("./images/connection.gif")} style={{height: 150, width: 150, resizeMode : "stretch"}}/>
         <Text style={{ fontFamily:"IRANSans", fontSize:18, textAlign:"center", color:"#b0b5bb" }}>لطفا اتصال اینترنت خود را بررسی کنید ...</Text>
      </View>
    }
  }

  render() {
    return (
      <Provider store={store}>
         <Container>
             {this.handeView()}
             {this.sendNotification()}
         </Container>
      </Provider>
    );
  }
}
4

1 回答 1

0

正如@dentemm 提到的，这需要在本机代码中运行，因此您可以尝试使用此模块https://github.com/jamesisaac/react-native-background-task

注意：对于通知，我们通常使用外部服务向用户推送通知，例如 Firebase、Amazone SNS 或 Google Cloud Messages，即使您的应用程序完全关闭，通知也会到达用户，因为操作系统将处理通知并打开您的应用程序并在用户单击它时为您运行一个功能，有关更多详细信息，您可以查看本教程https://medium.com/differential/how-to-setup-push-notifications-in-react-native-ios-android -30ea0131355e

于 2018-09-21T02:05:04.133 回答