我尝试了什么

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)} />
        )
    }   
}

React-Native在推送通知上呈现页面

我尝试了什么

3 个答案:

解决方案