[使用graphql查询时,我正在调用showUsers
函数,该函数应该显示所有用户(样式已完成,以便它们可以显示为框)。但是,目前没有任何显示。
我使用的是功能组件,而不是类组件。
此功能在我的handleSubmitForm
之后被调用。我在这里叫showUsers
。
const getFriendId = React.useCallback(
(data) => {
if (data) {
if (data.users.nodes.length == 0) {
Alert.alert('User Not Found');
} else {
const numberOfUsers = data.users.nodes.length;
showUsers(data, numberOfUsers);
addFriend(Number(data.users.nodes[0].id));
}
}
},
[addFriend],
);
showUsers():
const showUsers = React.useCallback(
(data: UsersLazyQueryHookResult, numberOfUsers: Number) => {
for (var i = 0; i < numberOfUsers; i++) {
const userId = data.users.nodes[i].id;
const userName = (data.users.nodes[i].firstName).concat((data.users.nodes[i].lastName));
return(
<View style={styles.friends}>
<View style={styles.item}>
<Text>{userName}</Text>
</View>
</View>
)
}
},
[createUserRelationMutation],
);
这是我的表单的样子。我想我必须在这里进行编辑,但不确定如何。
return (
<Modal
visible={showAddFriendEmailPage}
animationType="slide"
transparent={true}>
<SafeAreaView>
<View style={styles.container}>
<View style={styles.searchTopContainer}>
<View>
<Formik
initialValues={initialValues}
onSubmit={handleSubmitForm}
validationSchema={validationSchema}>
{({ handleChange, handleBlur, handleSubmit, values }) => (
<View style={styles.searchFieldContainer}>
<View style={styles.form}>
<FieldInput
handleChange={handleChange}
handleBlur={handleBlur}
value={values.email}
fieldType="email"
/>
<ErrorMessage
name="email"
render={msg => (
<Text style={styles.errorText}>{msg}</Text>
)}
/>
</View>
<View style={styles.buttonContainer}>
<Button
rounded
style={styles.button}
onPress={handleSubmit}>
<Text style={styles.text}>Add Friend </Text>
</Button>
</View>
</View>
)}
</Formik>
</View>
</View>
</View>
</SafeAreaView>
</Modal>
);
};
注意:提交表格后,我只希望它们显示在按钮下方。
我尝试过:
const ShowUsers: React.FunctionComponent<ShowUsersProps> = ({
data,
numberOfUsers,
}) => {
console.log('Hello');
for (var i = 0; i < numberOfUsers; i++) {
const userId = data.users.nodes[i].id;
const userName = ((data.users.nodes[i].firstName).concat(' ')).concat(data.users.nodes[i].lastName);
console.log('Whats the Id', userId);
console.log('Whats the Id', userName);
return(
<View style={styles.friends}>
<View style={styles.item}>
<Text>{userName}</Text>
</View>
</View>
)
}
}
但是我在ShowUsers:
上得到了这个>
Type '({ data, numberOfUsers, }: PropsWithChildren<ShowUsersProps>) => Element | undefined' is not assignable to type 'FunctionComponent<ShowUsersProps>'.
Type 'Element | undefined' is not assignable to type 'ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)> | null'.
[使用graphql查询时,我正在调用showUsers函数,该函数应该显示所有用户(样式已完成,以便它们可以显示为框)。但是,目前没有任何显示。我...
[使用graphql查询时,我正在调用
showUsers
函数应该向所有用户显示(样式已完成,以便他们可以显示为方框)。但是,目前没有任何显示。