以下组件将传递未解决的setStateFromGraphQL返回的承诺。
我可以通过使useEffect函数异步来使代码正常工作,但这会触发警告。
import React, { useState, useEffect } from 'react';
import * as UserService from 'services/UserService';
import { userViewContainerStyles, userViewStatusStyles } from './styles';
import { View, Text, Button, AsyncStorage, StatusBar } from 'react-native';
import { Profile, UserItemList } from 'components/organisms';
import { GDStatusBar } from '../../atoms/StatusBar';
const logStuff = async (state, props) => console.log('state: ', state, 'props: ', props, 'async: ', AsyncStorage && await AsyncStorage.getItem('@MYAPP:userInfo'), 'object: ', await AsyncStorage.getAllKeys())
const setStateFromGraphQL = async () => {
const userId = AsyncStorage && await AsyncStorage.getItem('@MYAPP:userInfo')
return {
user: await UserService.GetUser(userId),
userPosts: await UserService.GetUserPosts(userId),
userWishlist: await UserService.GetUserWishlist(userId),
userBookmarks: await UserService.GetUserBookmarks(userId),
userFriends: await UserService.GetUserFriends(userId),
userFriendsRequested: await UserService.GetUserFriendRequested(userId),
userFriendsPending: await UserService.GetUserFriendsPending(userId),
userData: userId
}
}
export default UserView = (props) => {
const [state, setState] = useState({})
const [loading, setLoading] = useState(true)
useEffect (
() => {
const graphQLResponse = setStateFromGraphQL();
setState(graphQLResponse)
setLoading(false);
}, []
)
return <View style={userViewContainerStyles}>
<GDStatusBar />
{!loading && <Profile details = { state }>
<Text>Children</Text>
</Profile>}
{!loading && <Button onPress={async () => await logStuff(state, props)} title="click me"/>}
{<Button onPress={() => props.AuthUtils.logout()} title="Log Out"/>}
</View>
}
感谢您的帮助