after update to Release 4.0.2 props not working...

[lordenas]

Version

Tell us which versions you are using:

• react-native-router-flux v 4.0.2 (v3 is not supported)
• react-native ~0.55.2

Expected behaviour

login .js Actions.Account_list({ data: 'test!' })

accontlist.js console.log(this.props.data) = undefined

Actual behaviour

console.log(this.props.data) = test!

[daviscabral]

Please provide the code from the Example folder that reproduces this error.

[lordenas]

In the loginForm.js function myoutput() after a response is received, makes the transition to Action.Account_list({token: this.state.token, userName:this.state.userName})

But Account_list.js stopped seeing these props

[lordenas]

Something went wrong... I went back to yesterday's version and everything worked. Somehow ceased to be transferred to the props... If you go back to version 4.0.0-beta.31, everything works fine...

[dextermb]

I am also noticing that my props are not being populated

<TouchableOpacity
    style={_Challenges.container}
    onPress={() => Actions['ChallengeDetails'](
        {
            ...props,
            challenge: challenges[i]
        }
    )}
>
    // ...
</TouchableOpacity>

Output from this.props within componentDidMount:

Object {
  "animationEnabled": false,
  "drawerImage": 2,
  "drawerPosition": "right",
  "headerMode": "none",
  "init": true,
  "name": "_ChallengeDetails",
  "navigation": Object {
    "actions": Object {
      "closeDrawer": [Function closeDrawer],
      "dismiss": [Function dismiss],
      "goBack": [Function goBack],
      "navigate": [Function navigate],
      "openDrawer": [Function openDrawer],
      "pop": [Function pop],
      "popToTop": [Function popToTop],
      "push": [Function push],
      "replace": [Function replace],
      "reset": [Function reset],
      "setParams": [Function setParams],
      "toggleDrawer": [Function toggleDrawer],
    },
    "addListener": [Function addListener],
    "closeDrawer": [Function anonymous],
    "dangerouslyGetParent": [Function anonymous],
    "dismiss": [Function anonymous],
    "dispatch": [Function anonymous],
    "getChildNavigation": [Function getChildNavigation],
    "getParam": [Function anonymous],
    "getScreenProps": [Function anonymous],
    "goBack": [Function anonymous],
    "isFocused": [Function isFocused],
    "navigate": [Function anonymous],
    "openDrawer": [Function anonymous],
    "pop": [Function anonymous],
    "popToTop": [Function anonymous],
    "push": [Function anonymous],
    "replace": [Function anonymous],
    "reset": [Function anonymous],
    "router": undefined,
    "setParams": [Function anonymous],
    "state": Object {
      "key": "id-1535028451888-41",
      "params": Object {
        "animationEnabled": false,
        "drawerImage": 2,
        "drawerPosition": "right",
        "headerMode": "none",
        "init": true,
        "panHandlers": null,
      },
      "routeName": "_ChallengeDetails",
    },
    "toggleDrawer": [Function anonymous],
  },
  "panHandlers": null,
  "screenProps": undefined,
}

I do not see challenge prop 😨

[dextermb]

@daviscabral Any ideas where I can find the code that might be causing this within the source?

[daviscabral]

I noticed that with react-navigation@2.x - Scenes are being rendered all together with the Stack. So, when you are really logging it - it has no params being passed to it yet, so probably, the lifecycle is wrong, and that might be probably the issue with all the recent opened tickets here. If someone here have time to help dig on that, I would appreciate.

This might be related to #3202, #3197, #3196, and a couple of others?

[dextermb]

@daviscabral is this an issue with this library or react navigation? Maybe it's worth creating an issue in react-navigation if it is something to do with them. I'm need an app pushing out sometime today, but obviously I can't do that if navigation isn't working properly.

[daviscabral]

I need to investigate to be sure. Right now I am running late with work and might get back to it in the weekend.

What I usually do in these cases, where I have a deadline, is to fork the project I need, do my changes and install it direct from there with yarn, pointing the github repo.

[dextermb]

@daviscabral hmm alright. My issue is that I need onStateChange which is in the latest releases. When does onStateChange get implemented into react-nativation? Maybe we could do a branch from flux's beta 27 and just introduce onStateChange into it until these issues are resolved?

[daviscabral]

I think you can fork the repo, make the changes and then use that fork. I don't think beta versions will be supported. At least I have no plans to work with that (it will cause one more version to give maintenance).

[daviscabral]

As I've already commented in other issues and ended opening a specific issue for that (#3213) - beta.31 was the last one using react-navigation@1.5.

After that RNRF had a major upgrade in the dependency to version 2.0 - what changed a lot of things (and might be the reason why so many stuff are not working as before).

I am still trying to catch up on issues and bugs here.

[tuxity]

There is an ugly fix we can use until it's fixed ?

EDIT: I switched back to 4.0.0-beta.31 and it's working again

[dextermb]

@tuxity Unfortunately I'm using the onStateChange on Router and in 4.0.0-beta.31 it doesn't have it yet. Any updates on a potential fix, @daviscabral?

[daviscabral]

Not yet - I'll try to hack something on that :+1:

[dextermb]

@daviscabral master seems to have props working again. Perhaps the version bump for react-navigation resolved the issue?

[dextermb]

@daviscabral Nevermind. This isn't resolved.

<TouchableOpacity
    style={_Challenges.container}
    onPress={() => Actions['ChallengeDetails'](
        {
            ...props,
            challenge: challenges[i]
        }
    )}
>
    // ...
</TouchableOpacity>

👎

[daviscabral]

I switched back to 4.0.0-beta.31 and it's working again

That's because react-navigation@1.5 is used there - in the recent versions RNEF is using react-navigation@2 that has some breaking changes.

[aksonov]

@lordenas As @daviscabral mentioned we need you to reproduce the issue based on Example project, not your project.

[dextermb]

@aksonov We've confirmed that it's an bug with how React Native Router Flux communicates with the latest React Navigation versions

[aksonov]

@dextermb Sorry, but I can't help you until you don't give me modified Example. So far I can't find the bug with passing props.

[lordenas]

@aksonov, as I said, there is a problem in passing parameters. loginpage.js Action.Account_list({test: 'test'})

Account_list.js console.log(this.props.test) = undefined

All this occurred after upgrading to version 4.0.2 (4.01 same problem). The props just are not transferred to the other component.

[dextermb]

@aksonov Do you have a snack example making it easier for us to show examples?

[aksonov]

No. PR is welcome to make Example project as Expo project.

[dextermb]

@aksonov Seem like your app.json in the example doesn't even work with Expo without making changes to it.

Error: Missing app.json. See https://docs.expo.io/

From what I've noticed it's because you're missing required attributes.

[aksonov]

Please re-read my sentence above again. NO, we don't have Expo-compartible Example now. You are WELCOME to add PR and modify Example to make Expo-compartible

[dextermb]

@aksonov Is there any documentation on how to run it without Expo? I'd rather try and get functionality working properly before converting the example to Expo

[daviscabral]

I found out a few things about the tabBar and props - but are mostly the way things works now with React Navigation.

[dextermb]

@daviscabral Cool, I'll give it a go and let you know 💃

[daviscabral]

Do it please - just need that confirmed to proceed with the release.

[dextermb]

@daviscabral I'll continue the discussion in the PR thread

[aksonov]

Please check 4.0.3 release and create new ticket if any.

[jqtruong]

4.0.6 not working either; any luck, @daviscabral @dextermb ?

[anuj002]

Yes! I found the problem in 'Tab'. Tabs are 'wrapped' by default - i.e. all children are wrapped by Stack with own nav bar. You may disable wrapping by using wrap={false} for Tabs and check passing props again.

<Scene key="Scene" tabs={true} wrap={false}> <Scene key="someTab" component={SomeTab} title="SomeTab" icon={TabIcon}/> <Scene key="Modal" component={Modal} title="Modal" hideNavBar direction="vertical"/> </Scene>

Here props are find when passing from someTab to Modal via Actions.Modal({someProp: theProp})

[Znow]

Latest version not working either - also tried with wraps={false}without luck.

In my case, im using the element with a custom tab bar component:

<Tabs
          key={Routes.EDIT_NOTIFICATION}
          tabBarComponent={CustomTabBar}
          tabBarPosition="top"
          titleStyle={styles.titleText}
          navigationBarStyle={{backgroundColor: '#4099DA', height: 80, paddingTop: 10}}
          back={true}
          backButtonTintColor="white"
          backTitle="Back"
          backButtonTextStyle={{color: '#fff'}}
          renderRightButton={Profile}
          swipeEnabled={false}
          wrap={false}
        >
          <Scene 
            key={Routes.EDIT_NOTIFICATION_DETAILS}
            component={NotificationDetailsScreen} 
            hideNavBar/>
          <Scene 
            key={Routes.EDIT_NOTIFICATION_IMAGES}
            component={ImagesScreen} 
            hideNavBar/>
          <Scene 
            key={Routes.EDIT_NOTIFICATION_DAMAGE_CAUSE}
            component={DamageCauseScreen} 
            hideNavBar/>
        </Tabs>

And I can actually see my passed value in the custom tab component, but not in the scene I am showing