React Native TypeError:无法读取未定义的属性“navigate”

f45qwnt8  于 2023-03-03  发布在  React
关注(0)|答案(2)|浏览(149)

我为一个名为NewUser.js的屏幕编写了一个快照测试,下面是测试代码:

import React from "react";
import NewUser from "../app/screens/NewUser/NewUser"
import renderer from "react-test-renderer"

describe("<NewUser/>", ()=>{
  it("snapshot", ()=>{
    expect(renderer.create(<NewUser/>).toJSON()).toMatchSnapshot();
  });
});

这是NewUser.js

import React, { Component } from 'react';
import { StyleSheet, Text, View, Button} from 'react-native';

import styles from './Styles'

export default class NewUser extends Component {
   static navigationOptions = () => {
    return {
        headerStyle: styles.headerStyle,
        headerTintColor: '#fff',
        headerTitle: 'JetSet',
        headerTitleStyle: {
            flex: 1,
        }
    };
};

render() {

    const { navigate } = this.props.navigation;

    return (
        <View style={styles.background}>
            <View style={styles.container}>
                <Button
                    onPress={() => navigate('Survey', { survey: 'NewUserQuestions' })}
                    title="New User"
                />
            </View>
        </View>
    );
}
}

我在运行测试时得到了错误。我应该做些什么才能使测试可运行?谢谢。

a7qyws3x

a7qyws3x1#

我通过这样做解决了这个问题

{ navigation } = this.props
...navigation.navigate()

我仍然不确定导致这个问题的原因,解决方案也不完美,但它保存了我的代码。

xe55xuns

xe55xuns2#

添加导航模拟函数,如const navigate = jest.fn();“您的组件导航={{navigation}}“
在组件中传递导航属性

相关问题