文章预览
在 Web 应用开发中,有时我们需要 在单个会话内持久化状态 ,这意味着数据在页面刷新后保留,但在关闭浏览器后消失。 useSessionStorage 钩子提供了一种简洁的方式来将 React 状态与浏览器的 sessionStorage 结合,实现会话级的数据持久化。这个自定义钩子不仅简化了 sessionStorage 的使用,还完美融入了 React 的状态管理模型。以下是如何实现和使用这个自定义钩子: const useSessionStorage = ( keyName, defaultValue ) => { const [storedValue, setStoredValue] = React.useState( () => { try { const value = window .sessionStorage.getItem(keyName); if (value) { return JSON .parse(value); } else { window .sessionStorage.setItem(keyName, JSON .stringify(defaultValue)); return defaultValue; } } catch (err) { r
………………………………