undefined不是onPress的对象（评估this.props.navigation.navigate）

乔杜里·塔拉（Chaudhry Talha）

我是新来响应本机并收到此错误的人：

未定义不是对象（评估this.props.navigation.navigate）

这是一个非常常见的错误，但原因可能有所不同，因为我无法通过查看类似问题的其他答案来解决它。

我有一个包含以下代码的屏幕：

function MyClientsScreen(props) {

    return (
        <Stack.Navigator>
            <Stack.Screen name='Clients' component={ClientSrc} options={{
                title: 'My Clients',
                headerRight: () => (
                    <TouchableOpacity onPress={() => props.navigation.navigate('AddClients')}>
                        <Image source={require('../assets/addClient.png')} style={styles.addBtnImg} />
                    </TouchableOpacity>
                ),
            }} />
            <Stack.Screen name='AddClients' component={AddClientSrc} options={{
                title: 'Add New Client',
                headerRight: () => (
                    <TouchableOpacity>
                        <Text style={styles.headerButtton}>Save</Text>
                    </TouchableOpacity>
                )
            }} />
        </Stack.Navigator>
    );
}

在headerRight当前屏幕上的按钮应该导航到AddClients（这是堆栈导航内部）pessed时。

navigation没有在任何地方定义，并且当我将按钮代码包含在所创建的函数中时，我能够执行此操作，const ClientSrc = ({ navigation }) => {...但是当我将按钮作为headerRight按钮移动时，onPress开始抛出错误。

古拉帕兰·吉里塔兰（Guruparan Giritharan）

为了获得导航道具，该组件应该是导航的一部分。

您可以像下面这样处理不同

<Stack.Screen name='Clients' component={ClientSrc} options={({ navigation }) => ({
                title: 'My Clients',
                headerRight: () => (
                    <TouchableOpacity onPress={() => navigation.navigate('AddClients')}>
                        <Image source={require('../assets/addClient.png')} style={styles.addBtnImg} />
                    </TouchableOpacity>
                ),
            })} />

这些选项将导航传递给给定的功能，您可以使用该功能并访问导航。

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。