函数未在上下文调用中触发

时间:2021-02-10 11:44:10

标签: reactjs react-native

我正在尝试在 useEffect 钩子中运行一个函数,以便在屏幕加载时它会自动调用上下文并确定要做什么。

但无论出于何种原因,该函数都没有触发。屏幕成功加载并呈现,没有错误,但什么也不做。

这是我调用上下文的组件:

import React, { useContext, useEffect } from 'react';
import { View, StyleSheet, ActivityIndicator } from 'react-native';
import { AuthContext } from '../context/AuthContext';

const LoadingScreen = ({ navigation }) => {

  const { userSignedIn } = useContext(AuthContext)

  useEffect(() => {
    userSignedIn()
  }, [])

  return (
    <View style={styles.mainView}>
      <ActivityIndicator style={styles.indicator} />
    </View>
  )
}

还有我的上下文文件:

import React, { useState, useContext } from 'react';
import { navigate } from '../navigationRef';

import { Magic } from '@magic-sdk/react-native';
const m = new Magic('API key');

export const AuthContext = React.createContext();

export const AuthProvider = ({ children }) => {

  const [user, setUser] = useState([]);

  const userSignedIn = () => {
    return async () => {
    // Call Magic logged in
      const loggedIn = await m.user.isLoggedIn();
      console.log(loggedIn)
      // If user logged in, save details to user, and redirect to dashboard
      if (loggedIn === true) {
        const { issuer, email } = await m.user.getMetaData();
          console.log(issuer)
          console.log(email)
          setUser([issuer, email])
          navigate('authorisedFlow')
        // If user not logged in, redirect to login flow
      } else {
          console.log(userSignedIn)
          console.log("Not signed in.")
          navigate('loginFlow')
        }
    }
  };

  return (
    <AuthContext.Provider value={{ user, userSignedIn }}>
      { children }
    </AuthContext.Provider>
  )

谁能指出我做错了什么?感觉很简单..但是想不通。

1 个答案:

答案 0 :(得分:0)

您在调用 async 时返回了一个 userSignedIn 函数,因此通过使 userSignedIn 本身 async 为那些 await 调用工作,以下应该对您有用里面。

const userSignedIn = async () => {
    // Call Magic logged in
      const loggedIn = await m.user.isLoggedIn();
      console.log(loggedIn)
      // If user logged in, save details to user, and redirect to dashboard
      if (loggedIn === true) {
        const { issuer, email } = await m.user.getMetaData();
          console.log(issuer)
          console.log(email)
          setUser([issuer, email])
          navigate('authorisedFlow')
        // If user not logged in, redirect to login flow
      } else {
          console.log(userSignedIn)
          console.log("Not signed in.")
          navigate('loginFlow')
        }
  };