react-native - react native : Getting a "there is no route key defined" error

标签 react-native react-redux react-native-router-flux

我的代码位于 here

我收到一条错误消息:没有为关键 employeeList 定义路由。必须是以下之一:“auth”、“main”。我检查了 router.js 并且这个组件嵌套在主场景中,所以我不确定是什么问题。当我想创建一个员工或删除一个员工时,我得到了这个。我相信这与导航回员工列表屏幕有关。

enter image description here

最佳答案

更改并从 react-native-router-flux 导入堆栈,并为 root 和 auth 执行此操作。

当您转到堆栈的第一个元素时,您可以使用它的键调用它。这意味着如果你想转到 employeeList,你必须调用 Actions.main()。

这就是为什么人们通常用屏幕的名称来命名他们的父栈,并且首先加上“_”前缀。您可以使用 employeeList 命名堆栈,使用 _employeeList 命名第一个场景。试试这个,请让我知道结果

<Router navigationBarStyle={{ backgroundColor: '#2980b9'}}  titleStyle={{ color:'#fff', alignSelf:'center' }} >
        <Stack key="root" hideNavBar={true}>
            <Stack key='auth'>
                <Scene key='login' component={LoginForm} title = 'Please login' />
            </Stack>
            <Stack key='employeeList'>
                <Scene
                    key='_employeeList'
                    component={EmployeeList}
                    title ='Employee'
                    rightTitle="Add"
                    onRight={()=> Actions.createEmployee()} 
                    initial 
                    rightButtonTextStyle ={{ color:'white',alignSelf:'center',marginRight:5 }}
                /> 
                <Scene
                    key='createEmployee'
                    component={EmployeeCreate}
                    title='Create Employee'            
                />     
            </Stack>
        </Stack>
    </Router>

关于react-native - react native : Getting a "there is no route key defined" error,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47743068/

相关文章:

react-native - 使用 tcp 而不是 webSocket react native paho mqtt

javascript - 收到新属性时动画未开始

laravel - 带有 Laravel 后端和 React Native 应用程序的 Facebook 和 JWT Auth

javascript - Reduxjs 或简单地声明

react-native - 使用 React Native Router Flux 延迟加载屏幕

react-native - Share 在 iOS 13 上不起作用。 Expo 模块

sorting - 在 React Redux 中排序后重新渲染项目

javascript - Redux 状态修改不会在调度后立即反射(reflect)出来。调度是异步的吗?

reactjs - 使用 React Native Router Flux/Redux 保护路由(场景)

javascript - react native 路由器通量 : override left or right button inside component and access local function