vtils/_cjs/react/useLocalStorage.js

一个面向业务的 JavaScript/TypeScript 实用程序库。

"use strict";

exports.__esModule = true;
exports.useLocalStorage = useLocalStorage;
var _react = require("react");
var _reactUse = require("react-use");
var _utils = require("../utils");
var mp = (0, _utils.inMiniProgram)();
var storage = mp ? {
  get: function get(key) {
    return mp.getStorageSync(key);
  },
  set: function set(key, value) {
    return mp.setStorageSync(key, value);
  },
  remove: function remove(key) {
    return mp.removeStorageSync(key);
  }
} : {
  get: function get(key) {
    return localStorage.getItem(key);
  },
  set: function set(key, value) {
    return localStorage.setItem(key, value);
  },
  remove: function remove(key) {
    return localStorage.removeItem(key);
  }
};

/**
 * 已兼容小程序。
 */

/**
 * 已兼容小程序。
 */

function useLocalStorage(key, initialState) {
  var getLocalStorageItem = (0, _react.useCallback)(function () {
    try {
      var data = storage.get(key);
      if (data != null) {
        return JSON.parse(data);
      }
      return initialState;
    } catch (_unused) {
      return initialState;
    }
  }, [key, initialState]);
  var _useState = (0, _react.useState)(getLocalStorageItem),
    state = _useState[0],
    setState = _useState[1];
  var latestKey = (0, _reactUse.useLatest)(key);
  var latestInitialState = (0, _reactUse.useLatest)(initialState);
  var latestState = (0, _reactUse.useLatest)(state);
  (0, _reactUse.useUpdateEffect)(function () {
    setState(getLocalStorageItem());
  }, [key]);
  var set = (0, _react.useCallback)(function (nextState) {
    if (typeof nextState === 'function') {
      nextState = nextState(latestState.current);
    }
    setState(nextState);
    storage.set(latestKey.current, JSON.stringify(nextState));
  }, []);
  var reset = (0, _react.useCallback)(function () {
    storage.remove(latestKey.current);
    setState(latestInitialState.current);
  }, []);
  return [state, set, reset];
}