Reactjs 在不重新渲染ArcGIS地图的情况下更新状态

我正在使用React和ArcGIS构建交互式地图，允许用户：

更新地图上显示的数据图层（郊区、地方政府区域等）

更新了地图的视口（缩放和居中）

我遇到的问题是视口，特别是“缩放”和“中心”。例如，如果有人放大并更新数据层，它将恢复为初始状态视口设置

作为参考，这是我试图实现的React交互的一个示例：。如您所见，它允许您更新显示的数据层（建筑物、泊位等），而无需恢复到原始缩放设置

为了达到上述效果，我尝试了两种方法：

useState

并将“活动层”从“侧栏组件”传递到“地图组件”。问题在于，每次用户更改显示的数据层时，它都会恢复为初始状态视口设置

useContext

（也可使用

react tracked

），并使用全局状态跟踪activeLayers、缩放和居中。但是，问题是，每次用户更改缩放级别时，贴图都会重新渲染

目标

问题:

---

以上哪种方法更可取，我应该如何使用该方法来实现预期目标？

当用户执行将更改贴图的操作时，贴图必须重新渲染。 我认为应该使用

useState

来处理数据层的状态和缩放级别

但是，请确保保留两个单独的状态值，一个用于图层，另一个用于缩放级别。然后，在渲染贴图组件时，将这两个状态传递给贴图组件，以便它将使用上一个/新的缩放级别和层进行渲染。 如果图层更改而缩放级别未更改，则上一级别将传递给贴图组件，并且不会对其进行初始化

---

然后，您还可以使用

usemo

（）保存一些不需要的渲染（在值未更改时防止重新渲染）。

谢谢@SomoKRoceS！我从未使用过

usemo

，所以我会仔细研究一下。当您说“将两个状态都传递给地图组件”时，如果可以从“侧边栏”组件和地图组件更改缩放，是否会出现问题。因此，它将涉及在再次向下传递之前，将缩放状态级别从贴图组件向上传递到边栏组件？或者，将缩放状态级别存储为地图组件中的变量，并对照向下传递的缩放状态级别进行检查。。这似乎是一个复杂的方法，还是我遗漏了什么？@Darcy，不客气：）至于你的问题；好。。我可能还没有完全理解您的项目中的组件顺序，但是考虑一下，将边栏组件和MAP组件包装为包装组件的子代（我们称之为“代码> MaveValue”），这些状态将保持这些状态和 SESTATS/<代码>。然后将

setState

作为回调传递给子组件。在这种情况下，如果您发现

mapContext

有许多子级和子级对它的状态和变量感兴趣，那么您甚至可以使用React Context（参考下面的内容）。关于React上下文：再次感谢，我应该澄清组件顺序：）谢谢，我将探索该选项！