React-native-router-flux: Error: [react-native-router-flux] unique key should be defined

[CoderHar]

import React from 'react';
import { Scene, Router,Actions } from 'react-native-router-flux';
import LoginForm from '../src/LoginForm';
import EmployeeList from '../src/EmployeeList'
import EmployeeCreate from '../src/EmployeeCreate'

const RouterComponent=()=>{
return(

            <Scene 
                   key="Login" 
                   component={LoginForm} 
                   title='Login' />   
            <Scene 
                   key="EmployeeList" 
                   component={EmployeeList} 
                   title='EmployeeList'
                   rightTitle="ADD"
                   onRight={()=>console.log("error")}  />
            <Scene 
                   Key="EmployeeCreate" 
                   component={EmployeeCreate} 
                   title='Employee'  />       

    </Router>
);

}

export default RouterComponent;

[JimTeva]

Which version do you use? (in version 4.0.0-beta.24 you need to add a parent Stack with key='root' I think)

[CoderHar]

@tevatahiti
i use 3.43.0 and couldnt find out what the problem is yet

[CoderHar]

i updated my router flux version to 4.0.0 and used stack to wrap up the scenes now the error is now gone
but i could not navigate from EmployeeList to EmployeeCreate using onRight and Actions

[Blapi]

@CoderHar show your navigation code please, how do you do it ?

[JimTeva]

@CoderHar I see onRight={()=>console.log("error")} in your EmployeeList scene
The function should call Actions.EmployeeCreate() (in actionsCreator if you use Redux)

[CoderHar]

@tevatahiti im sorry it was actually used for checking whether the onRight works or not.even if i change onRight to Actions.EmployeeCreate it doesnt work

[Blapi]

Even with Actions.EmployeeCreate() ? Did you try it?

[Blapi]

@CoderHar Show more of your code and the error messages because you don't really help here

[CoderHar]

@Blapi see i want to put my navigation to emplyeecreate in theat onRight part but i couldnt do it with Actions.EmployeeCreate so that i put there a console.

[Blapi]

Please @CoderHar, show your exact code and show the error message

[CoderHar]

@Blapi Check out the code that i have chenged and the employeeCreate component
import React,{Component}from 'react';
import { Scene, Router,Actions,Stack } from 'react-native-router-flux';
import LoginForm from '../src/LoginForm';
import EmployeeList from '../src/EmployeeList'
import EmployeeCreate from '../src/EmployeeCreate'
import * as actions from './actions'
import { connect } from 'react-redux';

   class RouterComponent extends Component{

       render(){
        return(
            <Router sceneStyle={{paddingTop:0}}>
                <Stack key='root'>
                    <Scene 
                        key="Login" 
                        component={LoginForm} 
                        title='Login' />   

                    <Scene 
                        key="EmployeeList" 
                        component={EmployeeList} 
                        title='EmployeeList'
                        rightTitle="ADD"
                        onRight={()=>Actions.EmployeeCreate()}  />


                    <Scene 
                        Key="EmployeeCreate" 
                        component={EmployeeCreate} 
                        title='Employee'  />  

                </Stack>
            </Router>
        );
    }
    }
   /*const mapStateToProps=state=>{
      return  {authentication:state.authentication}
    } */

export default connect(null,actions )(RouterComponent);

[CoderHar]

import React,{Component} from 'react'
import {Text, View} from 'react-native'
class EmployeeCreate extends React.Component{
render(){
return(

);
}
}

export default EmployeeCreate;

[CoderHar]

@Blapi the error is the Actions.EmployeeCreate is not a function

[Blapi]

@CoderHar

<Scene Key="EmployeeCreate" component={EmployeeCreate} title='Employee' />

key and not Key

[CoderHar]

@Blapi could you please be more specific i couldnt get you

[Blapi]

You wrote key with a capital K on your EmployeeCreate scene, it is key with a lowercased k, not a uppercased k (key !== Key)

[CoderHar]

really really thank you @Blapi

[Blapi]

@CoderHar no problem, I guess you can close this issue ;)

[CoderHar]

@Blapi sure

[aksonov]

@Blapi thank you for help!. As you can see most issues here are not issues, but questions - you may redirect them to stackoverflow and answer there with getting all benefits. Also I can make you collaborator to deal with it if you wish.

[Blapi]

@aksonov yep sure I'd like that !

[aksonov]

Done. Please be careful with PR merging - the code should be reviewed and tested before

[Blapi]

Sure, btw could you help me with this please ? #2628 , more and more users (like me) would love information about this. We can talk about this in DM on Twitter (@olisturbois) if you want, I already follow you