Блог

У меня есть приложение, и мне нужно вести историю поиска, на мой взгляд Map , здесь подходит:

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

чтобы обновить его, используйте setSearchHistory(new Map([[text, result.repos]])); , но он заменяет карту новой картой, не могли бы вы сказать мне, как я могу добавить значение к карте, инициализированной в состоянии?

Функция обновления состояния, возвращаемая, 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);
  

Вы можете добиться этого следующим образом:

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

function onChange(key, value) {
  // change the searchHistory map with a new Map from the current searchHistory, and the new key, value
  setSearchHistory(new Map([...searchHistory, [key, value]]));
}