如何使用react向状态初始化的Map添加值？

Question

我有应用程序，我需要保留搜索历史记录，我认为Map这里适合：

const [searchHistory, setSearchHistory] = useState(new Map());

要更新它，setSearchHistory(new Map([[text, result.repos]]));但它会用新地图替换地图，您能告诉我如何为状态初始化的地图添加值吗？

Answer 1

返回的状态更新器函数不会像基于类的组件中useState那样合并状态。this.setState()在功能组件中，您必须手动将旧状态与新状态合并。

您将新Map对象传递给setSearchHistory，因此它将完全覆盖旧状态。

Map您可以通过首先将旧对象中的条目复制到新对象中来更新状态Map，然后添加要在状态中添加的新条目。最后，将这个新Map对象传递给setSearchHistory.

// copy (shallow) the old map's entries in the new Map
const updatedMap = new Map(searchHistory);  
// add the new entry in the 'updatedMap'
updatedMap.set(key, value);
// update the state
setSearchHistory(updatedMap);