typescript - 在使用 React Native 测试和 TypeScript 时传递道具

Question

嘿，我正在尝试为也使用 TypeScript 的项目实现 react-native-testing-library。我的问题涉及将道具传递给我的测试的最佳方式。

例如，如果我的 src/example.tsx 是：

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

export interface Props {
    text: string;
    func: () => void;
}

export const Example: React.FC<Props> = ({ text, func }: Props) => {
    return (
        <View>
            <Button onPress={func} title={text} />
        </View>
    )
}

而我的 src/ test / example.test.tsx 是：

import React from 'react';
import { render } from '@testing-library/react-native';
import { Example, Props } from '../example';

describe('example', () => {
    const { getAllBy } = render(<Example {...Props} />); <---- *Error
}

我显然得到了错误：

'Props' only refers to a type, but is being used as a value here.

做这个的最好方式是什么。我是否需要手动创建一个模拟道具对象来输入我的每个组件，还是有更好的方法来做到这一点？

标签： typescriptreact-nativereact-native-testing-library