在 useEffect 之外只调用一次函数反应原生

Question

I have a function for setting up push notifications which needs to be called one time after the user logs in. This has to be outside of useEffect because the documentation says so.

I tried calling it in the component which comes after the user logs in, but the function is called 3 times after app is opened from killed state. Is there a way to limit this call to only one?

Here is the code so far:

const HomeScreen: FC<Props> = ({navigation}) => {

  setupPushNotifications();

    return (
    <SafeAreaView style={homeStyles.wrapper}>
      <Header navigation={navigation} />
      <View style={homeStyles.container}>
...
...

One way to do it would have been to use constructor in react classes, but the whole application is written in ES6 and relies too much on hooks.

Is there any other way i can make this work?

Answer 1

You can call this in your main file index.js in root directory of your project

import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';

setupPushNotifications();

AppRegistry.registerComponent(appName, () => App);

But you said you want to call it only if user is logged in then in the same file where you placed setupPushNotifications just update the position of it and move it out side class block.

setupPushNotifications();

const HomeScreen: FC<Props> = ({navigation}) => {
   ...
}