function - 没有从函数 [React Native] 获得任何返回值

Question

我有这个菜单，我在用户登录时过滤按钮，并且我正在从单独的文件访问一个函数以检查用户是否登录。

从菜单

import { IsLogged } from '../GlobalFunctions';

const SubDrawer1 = ({ data, onChange }) => (
    <View>
    {
        IsLogged() ? (
            <View>
                <TouchableOpacity onPress={()=>{onChange('LogoutScreen')}}>
                    <Text>Logout</Text>
                </TouchableOpacity>
            </View>
        ) : (<View />)
    }     
    </View>
);
export default SubDrawer1;

来自 GlobalFunctions

export function IsLogged(){
    AsyncStorage.getItem('userId').then((userId) => {
        return userId ? true : false
    })
}

从菜单中我调用IsLogged()函数，但值是undefined当我 console.log 它时。它应该返回trueor false。

标签： functionreact-nativereturn-value

Answer 1

您正在尝试调用异步函数，因此您需要添加一些额外的代码。试试下面的。

子抽屉1

import { Text, View, TouchableOpacity } from "react-native";

import React, { Component } from "react";
import { IsLogged } from "../GlobalFunctions";

const SubDrawer1 = async ({ data, onChange }) => {
  const status = await IsLogged();
  if (status === true) {
    return (
      <View>
        <View>
          <TouchableOpacity
            onPress={() => {
              onChange("LogoutScreen");
            }}
          >
            <Text>Logout</Text>
          </TouchableOpacity>
        </View>
      </View>
    );
  } else {
    return (
      <View>
        <View />
      </View>
    );
  }
};

export default SubDrawer1;

'IsLogged()' 全局函数

export function async IsLogged(){
    let userId = await AsyncStorage.getItem('userId');
    return userId ? true : false
}

'SubDrawer1' 使用类

...

import SubDrawer1 from "./SubDrawer1"; // import your 'SubDrawer1' component

var subDrawer1Component; // declare a variable for your rendering component

//Your main class
export default class ClassName extends Component<Props> {

  componentDidMount() {
    this.getComponentInfo(); //Call this method to get function
  }

  getComponentInfo = async () => {
    subDrawer1Component = await SubDrawer1();// Will take the component
    this.setState({ isDataGet: true });
  };

  render() {
    return (
        ...

        {subDrawer1Component}

        ...
    );
  }

}

...