Reactjs 如何模拟i18next和react-i18next以使用typescript测试组件/视图

我基本上有一个react网站，我使用typescript作为源代码和测试代码。我已将i18next和react-i18next库集成到我的项目中，以支持翻译，并修改了我的一个react组件。然而，当我尝试单元测试用翻译扩展的组件时，我遇到了问题。我遇到的第一个问题是我得到了一个编译错误，说我的道具丢失了：i18n、tReady和t。是的，他们确实不在那里，但我不确定该如何处理

我已经尝试在我的测试中包括下面的模拟，这可能会将所需的道具传递给我的组件：

jest.mock("react-i18next", () => ({
    withTranslation: () => (Component: any) => {
        Component.defaultProps = {
            ...Component.defaultProps,
            t: () => "",
        };
        return Component;
    },
}));

我的代码是这样的：

interface DemoViewProps extends WithTranslation {
name: string;
}

const DemoView=（道具：DemoViewProps）=>{
const{t，name}=props；
返回{t（“字符串id”）}{name}
}
这就是我的测试代码的样子：
描述（“，（）=>{
常量道具={
姓名：“姓名”，
};
常量分量=浅（）；
它（“应该做点什么”，（）=>{
…这里有一些测试
});
});

---

我希望不会出现编译错误，并且能够运行单元测试。我还希望我的代码不要变得太麻烦，因为我将在使用withTranslation（）的不同组件之间执行此操作。

您整理好了吗？

const DemoView = (props: DemoViewProps) => {
const { t, name } = props;
return <div>{t("string id")} {name}</div>
}
This is how my test code looks like:

describe("<DemoView>", () => {
const props = {
name: "NAME",
};
const component = shallow(<DemoView {...props} />);
it("should do something", () => {
...some testing here
});
});