来自useSelector的数据会导致无限重新呈现为依赖项
是指在React中使用Redux的useSelector钩子函数时，如果返回的数据发生变化，会导致组件重新渲染，从而可能引发无限循环重新渲染的问题。
useSelector是Redux提供的一个用于从Redux store中获取数据的钩子函数。它接收一个回调函数作为参数，该回调函数用于从store中选择需要的数据。当选择的数据发生变化时，组件将重新渲染。
然而，如果在回调函数中使用了其他的useSelector钩子函数，并且这些钩子函数的依赖项与当前的useSelector钩子函数的依赖项有交集，就会导致无限重新呈现的问题。因为每次重新渲染都会触发所有的useSelector钩子函数，从而形成一个循环。
为了解决这个问题，可以使用React的memo函数或useMemo钩子函数来优化组件的性能。memo函数可以将组件包裹起来，使其只在props发生变化时才重新渲染。而useMemo钩子函数可以缓存计算结果，只在依赖项发生变化时才重新计算。
另外，还可以使用reselect库来创建可记忆的选择器，它可以缓存选择器的结果，只在选择器的输入发生变化时才重新计算。这样可以避免不必要的重新计算和重新渲染。
总结起来，当使用useSelector时，需要注意以下几点：
- 避免在回调函数中使用其他的useSelector钩子函数，以免形成循环依赖。
- 使用memo函数或useMemo钩子函数来优化组件的性能，避免不必要的重新渲染。
- 可以考虑使用reselect库来创建可记忆的选择器，提高选择器的性能。
腾讯云相关产品和产品介绍链接地址：
相关·内容
我正在使用redux-thunk做一个简单的CRUD。 一切正常，我从存储中获取数据，就像这样，并将其呈现在一个表组件中。，我希望Table组件重新呈现一次，显示缺少删除值的新表。因此，当我使用数据配置useEffect时，它会无限地重新呈现。useEffect(() => { }, [dispatch,data]) 我只想让组件呈现一次，导致数据的</e
浏览 32提问于2021-08-29得票数 0
回答已采纳
我有一个从topics派生出来的列表useSelector，我在回调函数updateXXX中使用它，并将它添加到依赖关系的useCallback数组中，不幸的是，它会导致无限的呈现。const topics = useSelector(...);
const filteredTopics = topics.filter(...);
}, [to
浏览 4提问于2022-03-10得票数 0
1回答
import React, { useState, useEffect } from "react"; const pins = useSelector(state => state.pins.pins); dispatch(getPins(p
浏览 3提问于2020-01-03得票数 1
回答已采纳
这是我的代码。我想在列表的顶部添加一个新的费用项目。我希望得到一些帮助，告诉我如何在列表的顶端创建新的费用。我一直得到相同的错误:太多的重新渲染。React限制渲染的次数，以防止无限循环。/slices/dataSlice";
const RenderedExpe
浏览 1提问于2021-09-06得票数 0
从useEffect 钩子中的Redux存储获取状态的正确方法是什么？useEffect(() => { });Invariant Violation: Hooks can only be called inside the body of a我想我明白为什么它破坏了
浏览 10提问于2019-09-29得票数 36
回答已采纳
3回答
这是负责获取数据和更新列表的代码：import axios from "axios";
console.log(itemsList)
浏览 6提问于2022-06-06得票数 1
1回答
有一个关键的区别--我将一个fetch函数传递给要从调用的子组件，所以我不能简单地将函数移动到效果的主体中。每次呈现时都会重新创建fetch函数，并导致无限循环。= useSelector(selectors.getItems); const fetchItems"fetchItems“每次都被重新创建，并<em
浏览 1提问于2019-06-18得票数 7
回答已采纳
React useEffect缺少一个依赖项：“调度”。要么包含它，要么删除依赖数组react/react。这是我的密码
函数寄存器(Props){ const inusers=useSelector( (state) => {返回状态})；const history=useHistory() const
浏览 6提问于2021-10-19得票数 7
2回答
在EachUser组件中，如果不使用useEffect钩子，我就不明白为什么组件会一次又一次地挂载。谁能帮我弄明白为什么。
我不会改变任何道具或状态，所以我不认为无限循环应该发生，但它正在发生。下面是指向我的代码沙箱的链接：
浏览 1提问于2021-05-07得票数 0
回答已采纳
我是新的反应，我开始玩redux，但我注意到每次我的子组件(图标包)改变包中的项目数，整个标题组件重新呈现。标头组件 const { hidden } = useSelector(state => state.cart);createSelector( cart => cart.cartItems con
浏览 3提问于2020-07-13得票数 1
回答已采纳
我知道我可以将依赖项作为数组传递给它，以控制组件的呈现。我已经使用道具和本地状态来做，它是有效的。 让我感到困惑的是，当我将redux reducer作为依赖项传递时，它会导致呈现组件的无限循环。// users组件 const usersComp = () => {
浏览 150提问于2021-02-28得票数 1
回答已采纳
我有一个功能强大的react组件Tasks_1，最初，我想从成功工作的redux存储中检索userId。在此之后，我想使用我从redux存储中检索到的useEffect中的userId从后端获取数据。 当useEffect运行时，它会说有一个从状态id检索到的空字符串。function Tasks_1 () { const [id, setId] = useState(''); const userId = useSelec
浏览 26提问于2021-08-17得票数 1
回答已采纳
const history = useHistory() history.push(`/my/link`)
}, []) 然后react报告缺少依赖项history我不明白为什么history会成为这里的依赖项。它不是state变量，也不是来自props的变量。如果我将history添加到依赖数组中，是否会导致对useEffect的<
浏览 33提问于2021-09-23得票数 2
回答已采纳
因此，我使用空依赖项(Componentdid挂载)调用useEffect内部的useEffect，并在redux存储中更新一个状态，我也试图使用useSelector访问同一个组件中的相同状态，但它会导致无限循环谢谢export const PostsByTerm = () => { dispatch(
浏览 6提问于2021-12-14得票数 0
我的组件显示一个包含用户的表。用户被加载(getOverviewCitizensToday())到redux状态，并作为组件作为属性(mapStateToProps)传递。为了请求用户列表，我需要指定offset (users.length)，这样我的useEffect就需要users作为依赖项。} }, [getOverviewCitizensToday, sorting.order, sorting.orderBy, users.length]) 这会导致<
浏览 19提问于2020-08-03得票数 0
我的react应用出了点问题。我从elasticsearch服务器检索数据，并尝试将其显示在网站上。export default RecipesPage
问题是，当我试图显示数据时我猜这是一个与useRef挂钩有关的问题，但我不确定。
浏览 10提问于2021-05-15得票数 0
回答已采纳
一般来说，我对响应钩子非常陌生，对useSelector和useDispatch在react-redux中也非常陌生，但是在加载组件时，我执行简单的get请求时遇到了困难。我有一个钩子，我试图抽象我的州代码： const dispatch = useDispatch();
const data = useSelector我在一个没有运行ESLint的文本编辑器中打开这个文件，所以当我能够用一个空白的[]保存us
浏览 0提问于2019-06-17得票数 2
如果组件使用来自自定义钩子的某些数据，并且自定义钩子还包含上述组件未使用的数据(本地/全局)，则即使非依赖数据发生更改(非原始类型的引用)，组件也会重新呈现。有什么办法可以防止这种情况发生吗？useTest.hook.js const { } = use
浏览 7提问于2022-03-30得票数 0
我在一个React本机项目中有一个屏幕，它本质上只是在从服务器获取数据的同时呈现一个加载图标，然后再将用户带到主屏幕。我面临的问题是，当connectWithkey()运行时，它使用的是私钥的初始空值，而不是更新的值。, update after getPrivateKey() const我尝试将privateKey添加到数组<em
浏览 1提问于2020-02-21得票数 2
我有一个驻留在存储中的数组，我们称它为users，并且我有一个自定义钩子(通过useSelector)从存储中检索它。基于存储中的这个数组，我在我的组件中有一个本地状态，我将其用作表的显示源。我需要把它单独放在本地状态，因为我是根据搜索功能过滤数据的。 我想要做的是，每当存储中的数据发生变化时，我也希望更新本地状态以反映这些变化(但在此之前调用它上面的过滤函数)。但是，这会导致无限
浏览 9提问于2021-03-25得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
