React-Native在推送通知上呈現頁面

Question

我的index.ios.js響應推送通知。 如果手機處於打開狀態，我希望它可以將用戶發送到其他頁面。 我不確定該怎么做。 我正在使用OneSignals進行推送。

import React, { Component } from 'react';
import { ... } from 'react-native';

export default class Example extends Component {
    componentWillMount() {
      OneSignal.addEventListener('received', this.onReceived);
    }

    onReceived(notification) {
        // triggers on push
    }

    renderScene(route, navigator){ 
      return <route.component navigator={navigator} />
    }

    render() {
        return (
            <Navigator initialRoute={{component: Login}} 
            renderScene={this.renderScene.bind(this)} />
        )
    }   
}

AppRegistry.registerComponent('Example', () => Example);

我嘗試了什么

我試圖更改狀態，然后重新渲染整個可臨時運行的應用程序，但由於狀態無法更新而將您鎖定在該頁面中。

forceRerender(route, navigator){
  return <BarberShow navigator={navigator}  />
}

render() {
  if(this.state.notification){
    return <Navigator initialRoute={{component: AppointmentShow}} renderScene={this.forceRerender.bind(this)}/>
  }else{
    return <Navigator initialRoute={{component: Login}} renderScene={this.renderScene.bind(this)} />
  }
}

Answer 1

您在哪里在代碼中更改了狀態？

我還建議您使用“ React-native-router-flux”，它是管理導航的絕佳模塊。

如果您使用它：

 import React, { Component } from 'react'; import { ... } from 'react-native'; import Actions from 'react-native-router-flux'; export default class Example extends Component { componentWillMount() { OneSignal.addEventListener('received', this.onReceived); } onReceived(notification) { // triggers on push Actions.customView({notification}) } renderScene(route, navigator){ return <route.component navigator={navigator} /> } render() { return ( <Navigator initialRoute={{component: Login}} renderScene={this.renderScene.bind(this)} /> ) } } AppRegistry.registerComponent('Example', () => Example); 

您可以輕松地將用戶導航到任何視圖/組件，也可以將通知數據發送到該視圖。

Answer 2

對於本機反應，我建議您使用Ex-Navigation，您可以將其同時使用（反應本機和指數），並且它確實不錯，而且是東方的。

Answer 3

解

您要做的就是添加一個全局范圍變量來跟蹤導航器，以便index.ios.js可以訪問它。

var _navigator;
export default class Example extends Component {
    componentWillMount() {
      OneSignal.addEventListener('received', this.onReceived);
    }

    onReceived(notification) {
        _navigator.push({
          component: NewPageHere
        });
    }

    renderScene(route, navigator){ 
      _navigator = navigator;
      return <route.component navigator={navigator} />
    }

    render() {
        return (
            <Navigator initialRoute={{component: Login}} 
            renderScene={this.renderScene.bind(this)} />
        )
    }   
}