Question

我这样定义我的本地存储：

export default new class LocalStorage {
  setItem(key, data) {
    window.localStorage.setItem(key, JSON.stringify(data));
  }

  getItem(key) {
    return JSON.parse(window.localStorage.getItem(key));
  }

  removeItem(key) {
    window.localStorage.removeItem(key);
  }
}();

和我的RestrictionRoute是这样的：

const localStorageData = LocalStorage.getItem("root");    
export const RestrictionRoute = ({ component: Component, ...rest }) => {
      console.log(localStorageData);
      return (
        <Route
          {...rest}
          render={props =>
            localStorageData && localStorageData.token ? (
              <Redirect to="/" />
            ) : (
              <Component {...props} />
            )
          }
        />
      );
    };

我的注销操作：

export function logOut() {
  return function(dispatch) {
    dispatch(changeLoadingStatusTo(true));
    LocalStorage.removeItem("root");
    dispatch(changeLoadingStatusTo(false));
    dispatch(push("/login"));
  };
}

当我单击标题中的注销时，将触发注销操作，数据也将在本地存储中删除，并且在RestrictionRoute中，我通过console.log(localStorageData)再次检查localstorage，然后数据仍然存在。这让我感到困惑。

Answer 1

尝试直接检查“ LocalStorage.getItem（“ root”），而不要打印存储在变量中的值，因为localStorage是初始化类时存在的数据的副本。

在React中删除后，为什么仍要从本地存储中获取数据？

1 个答案: