Skip to content
This repository has been archived by the owner on Mar 9, 2021. It is now read-only.

not able to receive addListener willFocus #277

Open
king804 opened this issue May 13, 2019 · 9 comments
Open

not able to receive addListener willFocus #277

king804 opened this issue May 13, 2019 · 9 comments

Comments

@king804
Copy link

king804 commented May 13, 2019

componentDidMount(){
        this.props.navigation.addListener('willFocus', () =>{
            //don't work
        });
        this.props.navigation.addListener('didFocus', () =>{
            //don't work
        });
}

with react-navigation 3.0~3.9 also don't work

@lalithnarayan
Copy link

+1

@ruddell
Copy link
Contributor

ruddell commented May 13, 2019

Could you please add the output of ignite doctor (run in the root of your app folder) so that we can tell what boilerplate and versions are you using?

@lalithnarayan
Copy link

lalithnarayan commented May 14, 2019

System
platform darwin
arch x64
cpu 4 cores Intel(R) Core(TM) i5-5250U CPU @ 1.60GHz
directory /Users/lalithnarayankashyap/Documents/testApp

JavaScript
node 10.15.3 /usr/local/bin/node
npm 6.9.0 /usr/local/bin/npm
yarn 1.7.0 /usr/local/bin/yarn

React Native
react-native-cli 2.0.1
app rn version 0.57.7

Ignite
ignite 2.2.3 /usr/local/bin/ignite
boilerplate ignite-andross

Android
java 1.8.0_121 /usr/bin/java
android home - undefined

iOS
xcode 10.2.1

My Navigation looks like

export default createAppContainer(createSwitchNavigator(
  {
    AuthLoading: AuthLoadingScreen,
    App: MyDrawerNavigator,
    Auth: AuthStack,
  },
  {
    initialRouteName: 'AuthLoading',
  }
));
const MyDrawerNavigator = createDrawerNavigator({
  Home: {
    screen: home,
  },
},
  {
    contentComponent: DrawerComponent
  });

const AuthStack = createStackNavigator(
  {
    Login: LoginScreen,
  },
  {
    headerMode: 'none',
    initialRouteName: 'Login'
  }
);

this is my render

  render() {
    return (
      <Container>
        <NavigationEvents
          onWillFocus={payload => console.log('will focus', payload)}
          onDidFocus={payload => console.log('did focus', payload)}
          onWillBlur={payload => console.log('will blur', payload)}
          onDidBlur={payload => console.log('did blur', payload)}
        />
      </Container>

    )
  }

@king804
Copy link
Author

king804 commented May 14, 2019

here my ignite doctor

System
platform darwin

arch x64
cpu 4 cores Intel(R) Core(TM) i5-5350U CPU @ 1.80GHz

JavaScript
node 10.15.3 /usr/local/bin/node
npm 6.4.1 /usr/local/bin/npm
yarn 1.15.2 /usr/local/bin/yarn

React Native
react-native-cli 2.0.1
app rn version 0.59.3

Ignite
ignite 3.0.0-beta.3 /usr/local/bin/ignite
boilerplate ignite-andross

Android
java 1.8.0_211 /usr/bin/java
android home - /Users/sys_admin/Library/Android/sdk

iOS
xcode 10.2

My Navigation looks like

const PrimaryNav = createStackNavigator({
  MainScreen: { screen: MainScreen },
});

export const MainScreen = createBottomTabNavigator({
    MainTabScreen: { MainTabScreen}
},{
    initialRouteName: "GoodListScreen",
    headerMode: 'none',
    tabBarOptions: {

    },
})

here my MainTabScreen like

class MapScreen extends Component {
    componentDidMount(){
        this.props.navigation.addListener('willFocus', () =>{
            
        });
        this.props.navigation.addListener('didFocus', () =>{
            
        });
   }
}

here my package.json:

"react-navigation": "3.9.1",
"react-navigation-redux-helpers": "^2.0.6",
"react-redux": "^6.0.0",
"redux": "^4.0.0",
"redux-persist": "^5.10.0",
"redux-saga": "0.16.0",
"reduxsauce": "1.0.1",

@odraude7
Copy link

+1

@jamonholmgren jamonholmgren transferred this issue from infinitered/ignite May 29, 2019
@king804
Copy link
Author

king804 commented Jun 3, 2019

Fixed?

@m1r4s
Copy link

m1r4s commented Jun 10, 2019

I have found out there is a solution for those listeners
react-navigation/redux-helpers#53 (comment)

@bencergazda
Copy link
Contributor

@king804 @lalithnarayan @odraude7 @m1r4s This should be already fixed in #273

@liuhong1happy
Copy link

+1

mnzaki added a commit to jolocom/smartwallet-app that referenced this issue Jul 15, 2019
infinitered/ignite-andross#277
moaazsidat/react-native-qrcode-scanner#161
moaazsidat/react-native-qrcode-scanner#177
moaazsidat/react-native-qrcode-scanner#136
react-native-camera/react-native-camera#1797
react-native-camera/react-native-camera#1686
react-native-camera/react-native-camera#1686
react-navigation/redux-helpers#87
react-navigation/redux-helpers#60
react-navigation/redux-helpers#53
https://www.youtube.com/watch?v=CnQ8N1KacJc

Fixes #1326

The navigation actions were turned into ThunkActions and now directly
call react-navigation's navigator.dispatch, which handles state
internally

Usages of the navigationActions were fixed

Also QRcodeScanner was cleaned up a bit and hacked to properly re-enable
the camera by re-rendering it (so it gets remounted). Now camera works
again if you press back after scanning a QR code.
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants