Question

我想将导航道具传递给App.js中的Firebase NotificationListener，但是this.props.navigation是未定义的，我可以理解，因为App.js是启动导航的根。如果有任何解决方法，那就太好了。谢谢！

class App extends Component { 

componentDidMount() {
    notificationListener.initNotificationListener(this.props.navigation);
  }

  render() {
    return (
      <Provider store={store}>
        <PersistGate persistor={persistor} loading={null}>
          <Navigation />
        </PersistGate>
      </Provider>
    );
  }
}

export default App

Answer 1

一种解决方法是在打开通知时无法访问app.js中的props.navigation，方法是在从通知中打开应用后，在异步存储中设置一个值

//IN APP.JS
const notificationOpen = await 
    firebase.notifications().getInitialNotification();
    if (notificationOpen) {
      this._accessFromNotification();
    }

_accessFromNotification = async () => {
   console.log("Setting Access from Notification")
   await AsyncStorage.setItem('accessFromNot', true);}

此后，您可以从导航堆栈中第一个组件的componentDidMount内部的异步存储中调用此变量，如果该变量的值== true，则从那里导航到另一个组件。

//IN THE FIRST COMPONENT THAT HAS ACCESS TO PROPS NAVIGATION 
componentDidMount() {
this._verifyOpenFromNot()
}

_verifyOpenFromNot = async()=>{
   const acc=  await AsyncStorage.getItem('accessFromNot');


    if (acc){

        this.props.navigation.navigate('NotificationViewer');
        this._setAccessFalse();
      }


}

最后，您应该更新异步存储，将accessFromNot变量设置为false，以避免下次打开应用程序时自动导航。

_setEntroDesdeNotFalse = async () => {
await AsyncStorage.setItem('accessFromNot', 'false');}

Answer 2

使用导航操作来设置要移到侦听器的屏幕或想要发送的数据，然后再将其翻转。

Exmaple

import { NavigationActions } from 'react-navigation';

const navigateAction = NavigationActions.navigate({
  routeName: 'Profile',

  params: {},

  action: NavigationActions.navigate({ routeName: 'SubProfileRoute' }),
});
...
componentDidMount() {
    notificationListener.initNotificationListener(navigateAction);
  }

如何在App.js中访问this.props.navigation

2 个答案: