如何在useEffect react hook中编写用于URL推送的测试用例？
从../../actions/user.actions'导入{注销}； const注销=（）=> { useEffect（（）=> { Router.push（’/ any’）; }，[]）; }; 测试文件 afterEach（（）= >> { jest.clearAllMocks（）; }）; afterAll（（）=> { jest.
..
react-hooks相关内容
React函数组件中的模拟引用
我有React函数组件，其子组件之一具有ref。引用是通过 useRef 创建的。 我想用浅色渲染器测试组件。我必须以某种方式模拟ref来测试其余功能。 我似乎找不到任何方法来引用和模拟它。我尝试过的事情 通过childs属性访问它。 React不喜欢这样，因为ref并不是真正的道具 嘲笑useRef。我尝试了多种方法，只有在我的实现使用 React.useRef 时，它
..
使用useState（）挂钩测试功能组件时设置状态
当我用酶测试类组件时，我可以执行 wrapper.setState（{}）来设置状态。使用 useState（）钩子测试功能组件时，现在该怎么做？ 例如在我的组件中，我有： const [mode ，setMode] = useState（“ my value”）; 我想在我的内部更改模式测试 解决方案 使用挂钩中的状态时，您的测试必须忽略诸如状态之类的实现
..
如何在玩笑和酶中为useState Hook设置初始状态？
目前，Im使用带有React钩子的功能组件。但是我无法完全测试 useState 挂钩。考虑一种情况，例如，在 useEffect 挂钩中，我正在进行API调用并在 useState 中设置值。对于玩笑/酶，我已经模拟了数据进行测试，但是无法在玩笑中设置 useState 的初始状态值。 const [state，setState] = useState（[]）; 我想将初始状态设置为
..
使用Jest使用Hooks测试React功能组件
因此，我正在从基于类的组件转移到功能性组件，但是在用笑话/酶为功能性组件中显式使用钩子的方法编写测试时陷入困境。这是我的代码的精简版本。 function validateEmail（email：string）：boolean { return email .includes（'@'）; } const登录：React.FC =（道具）=> { const
..
使用Webpack在Electron项目中使用外部目录中的组件
我试图做到这一点尽可能简单，我研究了Yarn Workspaces一段时间，但这是当前不适用于Electron的解决方案，只是存在太多问题。 我在这里有Electron项目：./electron / 我在这里有一个包含组件的目录：./common / 这些组件是在React / JSX中开发的，没有什么特别的。就是说，我正在使用钩子（useXXX）。 我尝试了多种方法来包含这些
..
如何在React中使用useRef获得确切的DOM元素
我正在尝试使用'React.useRef（null）;'获取列表的ListItem中的确切DOM元素，但无法获取，我正在使用以下代码 useEffect（（）=> { //这是我尝试获取确切DOM元素 console.log（“ listRef”，listRef。当前）； }，[searchText]）； 这是我的codesandbox 链接 如何获取确切的DO
..
有可能在React中使用React.useState（（）=> {}）吗？
是否可以使用函数作为我的React Component的状态？ 示例代码在这里： p> //打字稿 类型OoopsFunction =（）=>虚空 导出函数App（）{ const [ooops，setOoops] = React.useState（ （）=> console.log（'default ooops'） ）; return
..
React JS：如何为条件渲染的组件制作动画？
示例是一个功能组件，其中有条件地渲染了 div 。我希望在有条件渲染时将此 div 变为淡入，反之亦然。淡入。 为此，我维护了两个局部状态变量： render 和 fadeIn 这是根据传给示例组件的 show 道具计算的。 我所做的是： 显示时 c将其设置为 true ，将 render 设置为 true ，因此将 div 有条件地渲染，并且在 10ms 超时后，我将 fade
..
ReactJS-使用react钩子防止模态的初始动画
我构建了一个简单的Modal组件，该组件在打开时会从底部滑动。单击模式触发按钮并单击背景时，动画效果良好。但是我在页面的初始渲染时看到了向下动画。如何防止初始动画？我特别在寻找如何使用react挂钩解决问题。 Modal.js import React，{useRef，useEffect} from'react'; 从“ react-dom”导入{createPortal}；
..
如何在全局标签内创建动态元素
我正在使用react挂钩，并且遇到一个问题，我现在被卡住了。 我有一个json数据，每当用户记录时，我都会获取在中，因此我创建了一个顶部栏，显示用户名，当用户单击这些名称时，我将显示他们创建的一些数据或在db中显示给他们，我已经从数据中获取的数据 我从服务器获取的我的数据 let data = [ { “ id”：1，1， “ name”：“ Maxi”， “ myData”
..
useEffect道具回调函数导致无限循环
我有一个与此非常相似的问题-我该如何解决React Hook useEffect中缺少的依赖项。 有一个主要区别-我将fetch函数传递给要从其调用的子组件 useEffect ，所以我不能简单地将函数移到效果主体中。每次渲染都会重新创建fetch函数，并导致无限循环。我还有其他要引起效果的本地组件状态。 我基本上有一个Container组件和一个Presentational组件。 M
..
反应挂钩-当嵌套属性在对象集合中更改时触发useEffect
页面显示对象列表 [{{name :, age：}，...] 第二页允许更新对象的名称特定对象。 然后使用挂钩，我应该如何实现 useEffect（）以便仅在检测到名称更改时才更新首页上的列表？ const [objects，setObjects] = useState（[]）; useEffect（（）=> { getAllObjects（） }，[getAllObject
..
使用useEffect React Hook时如何解决缺少依赖项警告？
使用React 16.8.6（在16.8.3之前的版本中很好），当我尝试防止对获取请求的无限循环时，出现此错误 ./ src / components / BusinessesList.js 第51行：React Hook useEffect缺少依赖项：'fetchBusinesses'。 要么包含它，要么删除依赖项数组react-hooks / exhaustive-deps
..
为什么我的状态不会立即在控制台日志中更新
我正在学习React和React钩子，我有一个问题。我有一个称为房间的状态，其中包含房间对象的数组。我创建了一个添加新房间的组件。您填写一个表单，然后单击“提交”按钮，它将触发一个函数，其中我使用setRooms（[... rooms，newRoom]）编辑了状态，同时更新了页面上的房间。由于某种原因，当我尝试将其登录到控制台中时（与第一次编辑房间的onSubmit函数相同），它会显示以前的状态，
..
每次点击显示不同的组件（使用挂钩）
我想通过单击每个按钮显示一个不同的组件。 我确定语法是错误的，有人可以帮助我吗？浏览器无法加载 我想解释我哪里出错了 一个组件（而不是 Home ）应在点击按钮后显示在 App组件上。帮助我了解正确的方法。 谢谢！ App.js import React，{useState} from'react'; import‘./App.css’； 从'./compone
..
使用UseState React Hook从子组件更新父组件状态
说我有一个这样的父组件： function Recipe（recipe）{ const [pageState， updatePageState] = useState（“ view”）; return（
..
有没有办法检查和取消选中“复选框”？从我的例子？
这是我的示例，我尝试检查并取消选中“复选框”，但是我很困惑，如果有人向我展示应该怎么做，我会很高兴。 从'react'导入React，{useState}; 从“ react-native”导入{View，Text，StyleSheet}；从'react-native-elements'中导入 {CheckBox}； const NewPlaceScreen = props =>
..
反应钩子和setInterval
除了在后台保留“时钟”以使用react钩子在轮播中实现自动下一步（几秒钟后）之外，还有其他选择吗？ 下面的自定义react钩子实现了轮播的状态，该轮播支持手动（下一个，上一个，重置，重置）和自动（启动，停止）方法来更改轮播的当前（活动）索引。 const useCarousel =（items = []）=> { const [current，setCurrent] = useSt
..
使用react-hooks在状态更新时执行异步代码
我有类似的东西： const [loading，setLoading] = useState（false）; ... setLoading（true）; doSomething（）; //
..