Question

我试图完成接收推送通知，然后根据推送通知将我的应用导航到特定路线。推送通知的所有内容都正常运行，我只是遇到了如何从应用程序根目录导航我的应用程序的问题，或者我需要采取不同的方法。

// root component that hooks up to redux and renders the app
class Root extends Component {
  render() {
    return (
      <Provider store={store}>
        <App />
      </Provider>
    )
  }
}

// app component that just renders the navigated application
class App extends Component {
  componentWillMount () {
    this._notificationSubscription = Notifications.addListener(this.handleNotification)
  }

  handleNotification = notification => {
    // handler for when a push notification is received
    if (notification.origin === 'selected') {
      // this is where I need to navigate      ] 
      console.log(navigation.data)
    }
  }

  render() {
    return <NavigatedApp />
  }
}

推送通知的处理程序有效，我有可用的数据。我需要执行this.props.navigation.navigate('PageDetail', { pageId })之类的操作，但显然导航属性此时不可用，因为它不在AppNavigator组件内部。我已尝试连接到redux，但是我仍然遇到导航调度操作在进入AppNavigator内部之前无法使用的问题。

任何想法如何从App组件执行导航或者可能采用不同的方法？

Answer 1

我没有你的场景的全貌，所以这可能不是百分之百合适但是看起来像是to call navigate on a top level component?

的情况

[...]

import { NavigationActions } from 'react-navigation';

[...]

// app component that just renders the navigated application
class App extends Component {
  componentWillMount () {
    this._notificationSubscription = Notifications.addListener(this.handleNotification)
  }

  handleNotification = notification => {
    // handler for when a push notification is received
    if (notification.origin === 'selected') {
      // this is where I need to navigate      ] 
      console.log(navigation.data)
      this.navigator && this.navigator.dispatch(
        NavigationActions.navigate({ routeName: someRouteName })
      );
    }
  }

  render() {
    return <NavigatedApp ref={nav => { this.navigator = nav; }} />
  }
}

从应用程序根目录导航应用程序

1 个答案: