React-native-router-flux: Actions.jump with parameter is not work

Created on 4 Nov 2018  路  2Comments  路  Source: aksonov/react-native-router-flux

Version

  • react-native-router-flux v4.0.5
  • react v16.6.0
  • react-native v0.57.4

Expected behaviour

page two should display parameter

Actual behaviour

there is no parameter, also console.log(this.props) has no parameter filed

Steps to reproduce

when I click 'go to page two' button, I except to see "Here is page Two parameter ". but actually is just "Here is page Two"

Reproducible Demo

my code here

export default class App extends Component<Props> {
    render() {
        return (
            <Router>
                <Scene key={'tabBar'} tabs hadeNavBar>
                    <Tabs key={'one'} component={PageOne} hideNavBar/>
                    <Tabs key={'two'} component={PageTwo} hideNavBar/>
                </Scene>
            </Router>
        );
    }
}

class PageOne extends React.Component {
    render() {
        return (
            <View>
                <Text>Here is Page One</Text>
                <Button onPress={()=>{
                    Actions.jump('two', {data: 'parameter'});
                }}>
                    <Text>go to page two</Text>
                </Button>
            </View>
        );
    }
}

class PageTwo extends React.Component {
    render() {
        return (
            <View>
                <Text>Here is Page Two</Text>
                <Text>{this.props.data}</Text>
            </View>
        );
    }
}

Do you have any solution? Or just I use it in wrong way?

Most helpful comment

@microxiong I was having the same issue but I have found the work around.

if you console.log the props on the PageTwo and look at the "name" prop. This is the tab name but it will have a underscore with it for example

name: _two" 

If you then write your onPress event like this it should work.

<Button onPress={()=>{
Actions.jump('_two', {data: 'parameter'});
 }}>

Let me know if you have any issues 馃憤

All 2 comments

@microxiong I was having the same issue but I have found the work around.

if you console.log the props on the PageTwo and look at the "name" prop. This is the tab name but it will have a underscore with it for example

name: _two" 

If you then write your onPress event like this it should work.

<Button onPress={()=>{
Actions.jump('_two', {data: 'parameter'});
 }}>

Let me know if you have any issues 馃憤

I have the same issue and found the same behavior to fix it, seems like the ineer key and the exposed key do not accept props the same way.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

willmcclellan picture willmcclellan  路  3Comments

jgibbons picture jgibbons  路  3Comments

VictorK1902 picture VictorK1902  路  3Comments

maphongba008 picture maphongba008  路  3Comments

sarovin picture sarovin  路  3Comments