return 来自 localForage getItem 的布尔值

Question

import localForage from 'localforage';
import React from 'react';
import globalHook, { Store } from 'use-global-hook';

interface State {
  isLoading: boolean;
  isAuthenticated: boolean;
}

type Action = {
  setIsLoading: (isLoading: boolean) => void;
  setIsAuthenticated: (isAuthenticated: boolean) => void;
};

const authenticate = localForage
  .getItem('token')
  .then((value) => {
    return value ? true : false;
  })
  .catch(function (err) {});

const initialState: State = {
  isLoading: false,
  isAuthenticated: false,
};

const actions = {
  setIsLoading: (store: Store<State, Action>, isLoading: boolean) => {
    store.setState({ ...store.state, isLoading });
  },
  setIsAuthenticated: (
    store: Store<State, Action>,
    isAuthenticated: boolean
  ) => {
    store.setState({ ...store.state, isAuthenticated });
  },
};

const useGlobal = globalHook<State, Action>(React, initialState, actions);

export default useGlobal;

嗨，我正在 reactjs 中实现登录功能，并使用 localforage 来存储令牌。我在全局状态中有一个 isAuthenticated 状态。现在我想根据 localForage 是否有令牌将 isAuthenticated initialValue 值更改为 true 或 false。因此，如果 localForage 有值或没有值，我想 return 一个布尔值。但现在它 return 是一个承诺，而不是 localForage 的布尔值。在此先感谢您的帮助

Answer 1

我觉得你的authenticate函数有点不对。我会做什么，我会验证一个函数，然后该函数会调用 localForage 来获取随后返回的令牌。

我已经制作了一个使用 localForage 的快速示例。我先在渲染组件时设置令牌，然后从 localForage 获取它。然后它会正确呈现该值，无需执行任何其他操作。请以此为例。你也可以找到它here

import React, { useState, useEffect } from "react";
import localForage from "localforage";

export default function App() {
  const [token, setToken] = useState("");
  const [error, setError] = useState(null);

  const authenticate = () => {
    return localForage
      .getItem("token")
      .then((value) => setToken(value))
      .catch((err) => setError(err));
  };

  useEffect(() => {
    localForage.setItem("token", "token123");
    authenticate();
  }, []);

  return (
    <div className="App">
      {error ? <p>Error {error}</p> : <p>Token: {token}</p>}
    </div>
  );
}

return 来自 localForage getItem 的布尔值

return a boolean value from localForage getItem

async-await

reactjs

es6-promise

localforage