我正在使用测试库+i18next,并试图将翻译传递到测试库的查询方法中,但遇到了类型错误.但是,如果我将translate函数的结果声明为变量,则效果很好.也许这是出于设计,或者这两个库中的某个库中的类型出了问题?

请参见CodeSandbox here.

import { screen } from "@testing-library/dom";
import i18n from "i18next";

// This works
const translation = i18n.t("my.translation.string");
screen.getByText(translation);

// This does not:
// Argument of type 'TFunctionResult' is not assignable to parameter of type 'Matcher'.
// Type 'undefined' is not assignable to type 'Matcher'.
screen.getByText(i18n.t("my.translation.string"));

推荐答案

我认为这是因为TS使用的类型推断算法.似乎他们没有使用基于统一的算法.

当进行类型推断时,TS只进行一次传递,当它需要对泛型函数(i18n.t是)进行类型推断时,这可能不够.

你可以阅读更多关于这thread的内容.

您所做的是拆分推理,TS可以处理此问题.您还可以通过提供类型来帮助算法,这样TS就不需要进行推理(或者实际上做得更好).类似这样:

screen.getByText(i18n.t<string>("my.translation.string"));

Typescript相关问答推荐

如何在不使用变量的情况下静态判断运算式的类型?

如何使用axios在前端显示错误体

angular 17独立使用多个组件(例如两个组件)

输入元素是类型变体的对象数组的正确方法是什么?'

键集分页顺序/时间戳上的筛选器,精度不相同

更新为Angular 17后的可选链运算符&?&问题

使用TypeScrip根据(可选)属性推断结果类型

TypeScrip:逐个 case Select 退出noUncheck kedIndexedAccess

如何使用WebStorm调试NextJS的TypeScrip服务器端代码?

已解决:如何使用值类型限制泛型键?

迭代通过具有泛型值的映射类型记录

为什么ESLint会抱怨函数调用返回的隐式`any`?

为什么Typescript不能推断类型?

如何 bootstrap TS编译器为类型化属性`T`推断正确的类型?

基元类型按引用传递的解决方法

是否有可能避免此泛型函数体中的类型断言?

NPM使用Vite Reaction应用程序运行预览有效,但我无法将其部署到Netlify

使用&reaction测试库&如何使用提供程序包装我的所有测试组件

如何在TypeScript类成员函数中使用筛选后的keyof this?

为什么我无法在 TypeScript 中重新分配函数?