首页 > 解决方案 > 为什么 App.js 中的异步函数在初始化时返回 undefined

问题描述

在我的 react native 0.59.5 中有一个异步方法检索 jwt 令牌App.js。该方法更像是一个包装器,并在 in 之后立即调用App.js

....
async function getToken() {
  try {
    const result = await helper.getJwtToken();
    console.log("secure store : ", result);
    if (!result) this.props.navigation.navigate("Signup");
    return result;
  } catch(err) {
    console.log("Error in retrieve jwt token : ", err.message);
    return {};
  };      

};

//socket.io
const result = getToken();
let jwt = result.password;
console.log("jwt token in App.js : ", jwt);
const socket = io(GLOBAL.BASE_URL + `?token=${jwt}`, {
  //const socket = io(GLOBAL.BASE_URL, {
    transports: ['websocket'],
    jsonp: false
  });
console.log("socket id in App.js : ", socket.id);

jwt 令牌在初始化后未定义:

05-20 22:47:31.660 23027 23027 D ReactNative: ReactInstanceManager.ctor()
05-20 22:47:31.904 23027 23027 D ReactNative: ReactInstanceManager.createReactContextInBackground()
05-20 22:47:31.905 23027 23027 D ReactNative: ReactInstanceManager.recreateReactContextInBackgroundInner()
05-20 22:47:43.156 23027 23027 D ReactNative: ReactInstanceManager.onJSBundleLoadedFromServer()
05-20 22:47:43.206 23027 23027 D ReactNative: ReactInstanceManager.recreateReactContextInBackground()
05-20 22:47:43.207 23027 23027 D ReactNative: ReactInstanceManager.runCreateReactContextOnNewThread()
05-20 22:47:43.346 23027 23096 D ReactNative: ReactInstanceManager.createReactContext()
05-20 22:47:43.525 23027 23096 D ReactNative: Initializing React Xplat Bridge.
05-20 22:47:43.545 23027 23096 D ReactNative: Initializing React Xplat Bridge before initializeBridge
05-20 22:47:43.572 23027 23096 D ReactNative: Initializing React Xplat Bridge after initializeBridge
05-20 22:47:43.572 23027 23096 D ReactNative: CatalystInstanceImpl.runJSBundle()
05-20 22:47:43.575 23027 23101 D ReactNative: ReactInstanceManager.setupReactContext()
05-20 22:47:43.577 23027 23101 D ReactNative: CatalystInstanceImpl.initialize()
05-20 22:47:43.593 23027 23101 D ReactNative: ReactInstanceManager.attachRootViewToInstance()
05-20 22:47:49.001 23027 23100 I ReactNativeJS: 'secure store : ', ''
05-20 22:47:49.002 23027 23100 I ReactNativeJS: 'Error in retrieve jwt token : ', 'undefined is not an object (evaluating \'this.props.navigation\')'
 05-20 22:47:49.049 23027 23100 I ReactNativeJS: 'socket id in App.js : ', undefined

但是在初始化后调出初始组件时,类似的代码(检索 jwt 令牌)工作正常,并且成功检索了存储的 jwt 令牌,socket.io 也是如此。如何使此async getToken代码App.js用于初始化?

标签: react-native

解决方案


问题是您不必等待getToken()函数完成。

调用时尝试使用awaitgetToken(),如下所示:

//socket.io
const result = await getToken();
let jwt = result.password;
console.log("jwt token in App.js : ", jwt);
const socket = io(GLOBAL.BASE_URL + `?token=${jwt}`, {
  //const socket = io(GLOBAL.BASE_URL, {
    transports: ['websocket'],
    jsonp: false
  });
console.log("socket id in App.js : ", socket.id);

推荐阅读