如何正确模拟 i18next

2024-05-03

这是我的函数和测试的简化版本。虽然我嘲笑了 useTranslation 我收到以下错误:

您正在传递一个未定义的模块!请检查您的对象 传递给 i18next.use()

   7 | i18n
   8 |   .use(Backend)
>  9 |   .use(initReactI18next)

我如何正确模拟以消除此错误?

import React from 'react'
import { useTranslation } from 'react-i18next'
import * as Constants from 'constants'
import MyComponent from 'components'

const Dashboard = () => {
  const { t } = useTranslation('dashboard')
  return (
     <div> Dashboard 
      <MyComponent name={t(Constants.MYCOMPONENT)}/>
    </div>
  )
}

export default Dashboard
jest.mock('react-i18next', () => ({
  useTranslation: () => ({ t: (key) => key })
}))
it('Render Dashboard without crash', () => {
  const div = document.createElement('div')
  ReactDOM.render(<Dashboard/>, div)

})

我可以让它为我们的设置工作的唯一方法如下:

jest.mock("react-i18next", () => ({
    initReactI18next: { type: "3rdParty", init: jest.fn() },
    useTranslation: () => ({ t: (key: string) => key }),
    Trans: ({ children }: { children: React.ReactNode }) => children,
}));

With initReactI18next: { type: "3rdParty", init: jest.fn() },

正如所提到的,这是拼图的最后一块here https://github.com/i18next/i18next/issues/1426#issuecomment-828656983

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何正确模拟 i18next 的相关文章

  • AWS JS SDK TypeError:STS 不是构造函数

    我有一个 ReactJS 应用程序 它使用 aws sdk 进行认知登录 我用了yarn安装所有模块 但是当我尝试访问 localhost 的网站时 出现 JS 错误 未捕获 承诺中 类型错误 STS 不是构造函数 错误指向该行aws sd
  • (节点:20732)[DEP0018] DeprecationWarning:未处理的承诺拒绝已被弃用。未来在nodejs中

    我正在尝试在我的应用程序中生成确认链接 虽然它工作正常并且也生成链接 但是当我访问该链接时 它在 Chrome 控制台中显示 POST http localhost 3000 api auth confirmation 400 Bad Re
  • 你如何在react-native中实现捏合缩放?

    我一直在研究 PanResponder 我当前的工作假设是 我将检测是否有两个触摸正在向外移动 如果是 则增加元素大小onPanResponderMove功能 这似乎是一种混乱的方法 有没有更顺畅的方法呢 如果您只需要简单的捏缩放功能 只需
  • 当 deps 为 [] 时,React 警告 React Hook useEffect 缺少依赖项

    我正在尝试清理 DOM 中的警告 并且对于每个useEffect部门在哪里 我收到一条错误消息 指出 useEffect 缺少依赖项 我想在安装组件时触发效果 我的印象是这就是做到这一点的方法 如果是这样 为什么会出现警告 这是我使用的简单
  • Ant设计文件上传中使用customRequest

    我正在使用 Axios 来处理文件上传 我遇到显示文件上传进度的问题 我使用的文件上传视图是 图片卡 HTML
  • 有什么方法可以复制 div 的渲染 HTML 吗?

    我正在开发电子邮件签名生成器 我想通过按按钮复制最终签名 而不是手动选择签名并将其复制到剪贴板 这意味着我需要它们的图像 文本和样式 我尝试了几种变体 包括 w3schools 的变体 但没有成功 其中一些只是复制文本 但没有样式 例子 h
  • 如何在create-react-app中注入没有REACT_APP前缀的dotenv变量?

    我有一个项目要从旧版 React 应用程序迁移到标准版create react app一个 未弹出 在遗留项目中 它手动加载 env文件与dotenv and dotenv expand并通过webpack注入DefinePlugin cr
  • 下一张图片不采用类属性

    我正在使用 Next js 和next image显示图像 但 CSS 在其中不起作用 该图像是 SVG 格式 我已将其放在公共文件夹中 我正在使用 Tailwind CSS 与此一起使用
  • 更改所选元素的颜色 - React

    我是反应新手 我试图更改所选的一个特定 li 的颜色 但它会更改所有 li 的颜色 此外 当单击另一个 li 时 我希望第一个 i 不再处于活动状态 这是代码 http codepen io polinaz pen zNJKqO http
  • Redux 减速器的副作用

    Redux 减速器应该没有副作用 但是 如果某个操作应该触发浏览器中文件的下载 其中内容基于商店的状态 该怎么办 这当然应该算作副作用吗 像下面这样的方法可以吗 还是我应该寻找替代方法 case SAVE GRID const json s
  • React App 中的图像损坏

    我正在尝试访问 React 应用程序中的图像 当我运行代码时 我在网页上看到一个损坏的图像图标 我不确定我是否正在访问图像的正确路径 我的代码如下 import React Component from react class Header
  • 如何使用 next auth 通过自定义 Spring API 库和端点进行身份验证

    我是 Next js 的新手 正在将我的前端从 React 迁移到 Next v4 我已经使用 Spring 开发了一个后端 它连接到 Azure 上托管的 MySQL 数据库 该 API 在 Postman 和 React 前端上经过全面
  • 如何判断何时创建新组件?

    我一直在寻找背后的逻辑当有人在 AngularJS Angular 上的 Web 应用程序中创建新组件时但我认为这更通用 可能适用于所有基于组件的前端框架 我知道有像这样的一些原则应该是抽象的和可重用的但例如我在角度文档中看到 每个单独的路
  • 以编程方式更改 Redux-Form 字段值

    当我使用redux formv7 我发现没有办法设置字段值 现在在我的form 我有两个select成分 当第一个时 第二个的值就会很清楚select元件值改变 在类渲染中 div div site div div div div
  • 如何使用 Coffeescript 在 React 中渲染 HTML 标签?

    我目前正在学习 ReactJS 以及如何使用 Ruby on Rails 作为其后端 所以如果我做出愚蠢的假设 我深表歉意 请随意责骂我 我正在关注一个教程 其中作者使用 Coffeescript 而不是 ES6 来处理他的 ReactJS
  • JSX 元素类型“Element[]”不是 JSX 元素的构造函数?

    types react 16 7 17 types react dom 16 0 11 打字稿 3 2 2 function ArryElement return div 1 div div 2 div function App retur
  • 使用 rollup.js 创建 React 库时出现错误 null(读取“useState”)

    我正在使用 rollup js 创建一个反应库 但是当我运行时npm run build我收到一个错误 仿佛useState尝试从中检索钩子null Uncaught TypeError Cannot read properties of
  • 将两个 JSON 数据合并为具有特定键值的一个

    我有两个 CSV 文件 球数据 json id 1 color red id 2 color blue 法庭 json court id 2001 ball in use 1 court id 2005 ball in use 2 如何根据
  • 在 React 中将模板分离到外部文件

    我正在为客户开发 ReactJS 应用程序 我希望客户端能够自定义应用程序中的一些配置和模板 所以我创建了一个config js file window APP CONFIG url example com template item di
  • 如何映射轮播的子项数组?

    我正在尝试将 Carousel 组件包装在映射对象数组周围作为组件的子级 目前我只能让映射创建映射对象的 1 个子对象 轮播需要像这样

随机推荐

  • 如何删除 TextBlock 周围的多余空间

    我为我的 TextBlock 设置了以下内容
  • 将嘈杂的硬币重塑为圆形

    我正在使用 JavaCV OpenCV 包装器 进行硬币检测 但是当硬币连接时我遇到了一些问题 如果我尝试侵蚀它们以分离这些硬币 它们就会失去圆形形状 如果我尝试计算每个硬币内部的像素 可能会出现问题 因此某些硬币可能会被误算为更大的硬币
  • SQL Server 2008 FileStream 与普通文件

    我正在创建一个像 youtube 这样的应用程序来存储视频 我需要一些建议 我应该使用 SQL Server FileStream 来存储视频文件 还是应该将它们存储在硬盘上的某个位置并将路径记录为 SQL Server 内的 varcha
  • 将第一行粘贴到列表中的列名称

    我有 68 个数据文件 全部具有相同的标识符 但具有不同的指示符 我将这些单独的文件转换为一个列表 其中每个数据框作为一个单独的元素 每个数据框的第一行是年份 我想将其粘贴到列名称中 我希望能够用 分隔它 例如 现在列名称为 Arbeits
  • 在 WPF 中向上/向下移动 ListBoxItem

    我创建了一个包含文件名的列表框 我想为用户提供一个选项 可以使用上 下按钮并使用拖放来上下移动文件名 任何人都知道如何实现此功能 XAML 代码
  • 如何续订过期的 ClickOnce 证书?

    我需要对一年多没有碰过的 ClickOnce 应用程序进行一些更改 因此证书已过期 我读过 使用新证书发布将使应用程序失败 因为它将使用不同的密钥进行签名 因此我认为我需要使用相同的证书但不知道如何更新它 如果您正在寻求快速解决方案 那么您
  • 如何将数字 010 转换为字符串“010”

    在控制台中执行一些随机表达式时 我发现 010 返回8 甚至 011 0100 都通过考虑八进制数字系统返回结果 如果我想转换一个数字 我该怎么做010到一个字符串 010 不仅为了010但对于每个相似的数字 我设法找到了一种类似的解释he
  • FindObjectOfType 返回 null

    我遇到的问题是我捡起一个掉落的物品 为枪添加弹药 使用所有方法和变量构建了一个 Gun 类 构建了一个从 Gun 类派生的 Rifle 类 步枪工作完美 没有任何问题 我现在添加一个 拾取 系统 其中 x 数量的敌人会掉落拾取 这是要拾取的
  • 使用 WIA 检测所有可用的扫描仪分辨率

    如何使用 WIA 2 0 以编程方式检测指定扫描仪的所有可用分辨率 以 dpi 为单位 支持的页面大小怎么样 有任何想法吗 伪代码 假设您有设备信息 请连接到它 var device deviceInfo Connect 如果设备不为空 那
  • Postgres 检查文本数组中的约束以确保值的有效性

    我想创建类似的东西 CHECK ALL scopes IN read write delete update scopes这是表中的一个字段text 我想确保该数组中的所有值都是上面的值之一 对此有何意见 是否有可能通过以下方式获取这些值S
  • 如何定义与 Backbone 一起使用的 jade 模板

    我需要使用模板来渲染每个 ItemView var ItemView Backbone View extend className item template template itemTemplate html initialize fu
  • 如果新块大小小于初始块大小,我是否应该强制重新分配检查?

    在这种情况下 realloc 会失败吗 int a NULL a calloc 100 sizeof a printf 1 ptr d n a a realloc a 50 sizeof a printf 2 ptr d n a if a
  • Keycloak 重定向 URI 提供 https://localhost 而不是 http://localhost

    我正在尝试在 Keycloak 上验证 Cordova Android 应用程序 我之前提出过一个关于它的问题 但我在这里将其简化为仅提供要点 因为我在过去 2 3 天中发现了很多东西 Cordova Android 应用程序中的网页不可用
  • 在 JSFiddle 上运行的简单 AngularJS

    如何用以下代码制作 jsfiddle div ul li num li ul div
  • 主表节点缺失

    我已经安装了 Microsoft SQL Server 2012 Express 当我启动 Management Studio 时 我无法查看系统数据库上的任何 表节点 这是一个错误吗 这是一个错误 如以下链接所述 http connect
  • Laravel 4 - 工匠错误 SQLSTATE[42000]

    我正在尝试为我的用户表创建一个新的迁移 我有以下架构 Schema create users function t t gt increments id t gt string username 16 t gt string passwor
  • 非时间戳列上的 Spark 结构化流窗口

    我收到以下形式的数据流 id timestamp val xxx 1 12 15 25 50 1 2 12 15 25 30 1 3 12 15 26 30 2 4 12 15 27 50 2 5 12 15 27 30 3 6 12 15
  • 从字典列表中删除具有重复值的字典

    我有一个字典列表如下 ppm error 5 441115144810845e 07 key Y7 obs ion 1054 5045550349998 ppm error 2 3119997582222951e 07 key Y9 obs
  • C++ 中的显式构造函数调用

    1 以下语句的返回值是多少 obj classX classX 2 关于C 中构造函数的另一个问题 classX 创建一个对象 编译器生成的扩展代码是什么 构造函数不返回值 就像函数返回一样void 对于第二个问题 编译器将调用构造函数 然
  • 如何正确模拟 i18next

    这是我的函数和测试的简化版本 虽然我嘲笑了 useTranslation 我收到以下错误 您正在传递一个未定义的模块 请检查您的对象 传递给 i18next use 7 i18n 8 use Backend gt 9 use initRea