Javascript 反应传单过多使用上下文更新值刷新映射

我在另一个组件中过滤了一个地图和一个列表，该组件显示了当前的标记。当我执行map.on（'moveend'）以显示标记列表时，我有一个刷新问题

我有一个包含2个数组的上下文。过滤数组和包含我的标记的数组。当我执行更新过滤列表的函数时，我刷新了数百个数据，页面崩溃

在创建地图的组件中，它只检索默认标记列表。我在另一个组件中显示过滤标记

我不想恢复我的地图，因为里面的数据没有改变，即使地图移动，我的标记列表仍然存在。我只想更新我的上下文数组以在另一个组件中显示列表

filteredListComp在其他组件中显示数据的数组

map.on('moveend', function(e){
  if(e.target.getBounds().contains(obj)) {
     filtered.push(m)
     setListCompContext(prevState => ({...prevState, filteredListComp: filtered }))
  } 
})

我在根项目上的初始上下文：

const [listDefaultCompContext, setListDefaultCompContext] = useState({
   defaultListComp: [],
   filteredListComp: []
})

---

问题来自next.js的动态导入，它装载了我的组件。当我移动地图时，组件总是挂载的

我做的第一件事是在页面导入级别创建一个匿名函数

在页面的我的组件中，我有一个useEffect，它需要我的组件的（）以避免未定义窗口

在我的mapLeaflet组件中，我有一个useEffect，它处理map.on（'moveend'）事件，以避免刷新过多

导入级别的“我的页面”组件： 从“xxxx”导入xxxx； ... 让MapLeaflet=（）=>{ 返回 } .... 从“xxxx”导入xxxx； /***************/ 在我的页面的功能组件中 常量myFunctionalComponent=（）=>{ useffect（（）=>{ MapLeaflet=require（'components/s/MapLeaflet'）。默认值 return（）=>{ /*毁灭*/ } }, []) } /***************/ 在我的地图容器中的组件中 常量MapLeaflet=（道具）=>{ } 常量LMapContent=（）=>{ useffect（（）=>{ //坐骑 //地图事件 地图上（'moveend'，（ev）=>{ …代码 }) return（）=>{ /*毁灭*/ } }, []) }

---

什么是

setListCompContext

-您是指

setListDefaultCompContext

还是这两个函数确实是独立的？这些标记在哪里渲染？您使用的是什么版本的react传单？setListCompContext是更新我的上下文的函数，setListDefaultCompContext是我的上下文的初始状态。我已经编辑了这篇文章。问题已经解决如果你解决了你的问题，那么请将解决方案作为答案发布，以便遇到它的其他人知道它已经解决了。

<ContextApp.Provider value={[listDefaultCompContext, setListDefaultCompContext]}>
    <DefaultLayout>
        <Component {...pageProps} />
    </DefaultLayout>
</ContextApp.Provider>