Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Closed
CoderHar opened this issue Dec 4, 2017 · 23 comments
Closed

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

CoderHar opened this issue Dec 4, 2017 · 23 comments

Comments

@CoderHar
Copy link

CoderHar commented Dec 4, 2017

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
Copy link

JimTeva commented Dec 4, 2017

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
Copy link
Author

CoderHar commented Dec 4, 2017

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

@CoderHar
Copy link
Author

CoderHar commented Dec 4, 2017

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
Copy link
Collaborator

Blapi commented Dec 4, 2017

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

@JimTeva
Copy link

JimTeva commented Dec 5, 2017

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

@CoderHar
Copy link
Author

CoderHar commented Dec 6, 2017

@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
Copy link
Collaborator

Blapi commented Dec 6, 2017

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

@Blapi
Copy link
Collaborator

Blapi commented Dec 6, 2017

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

@CoderHar
Copy link
Author

CoderHar commented Dec 6, 2017

@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
Copy link
Collaborator

Blapi commented Dec 6, 2017

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

@CoderHar
Copy link
Author

CoderHar commented Dec 6, 2017

@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
Copy link
Author

CoderHar commented Dec 6, 2017

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

);
}
}

export default EmployeeCreate;

@CoderHar
Copy link
Author

CoderHar commented Dec 6, 2017

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

@Blapi
Copy link
Collaborator

Blapi commented Dec 6, 2017

@CoderHar

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

key and not Key

@CoderHar
Copy link
Author

CoderHar commented Dec 6, 2017

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

@Blapi
Copy link
Collaborator

Blapi commented Dec 6, 2017

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
Copy link
Author

CoderHar commented Dec 6, 2017

really really thank you @Blapi

@Blapi
Copy link
Collaborator

Blapi commented Dec 6, 2017

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

@CoderHar
Copy link
Author

CoderHar commented Dec 6, 2017

@Blapi sure

@CoderHar CoderHar closed this as completed Dec 6, 2017
@aksonov
Copy link
Owner

aksonov commented Dec 6, 2017

@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
Copy link
Collaborator

Blapi commented Dec 6, 2017

@aksonov yep sure I'd like that !

@aksonov
Copy link
Owner

aksonov commented Dec 6, 2017

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

@Blapi
Copy link
Collaborator

Blapi commented Dec 6, 2017

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants