[英]pass a function to a custom react hook
以前,我使用的是這樣的 graphql 查詢。 數據從查詢返回,我使用setShowFlatList
和返回的data
:
const [loadUsers, { data }] = useUsersLazyQuery({
onCompleted: () => {
setShowFlatList(data);
},
});
現在我正在創建一個自定義反應鈎子,我在其中使用這個 graphql 查詢。 它看起來像這樣:
export const useLoadUsers = (onCompleted: any) => {
const [usersQuery, { data }] = useUsersLazyQuery({
onCompleted: () => {
if(onCompleted){
onCompleted();
}
},
onError: onLoadUserError,
fetchPolicy: 'network-only',
});
const loadUsers = async (
phoneNumber: number,
) => {
const data = await usersQuery({
variables: {
where: {
OR: [
{ phoneNumber: newPhoneNumber }
],
},
},
});
return data;
};
return loadUsers;
};
但是我不知道如何將setShowFlatList
函數傳遞給setShowFlatList
的onCompleted
,這樣我仍然可以使用data
作為鈎子內的參數。
編輯: onCompleted
也應該有一個參數數據,所以你可以使用那個。
export const useLoadUsers = (onCompleted: any) => {
const [usersQuery, { data }] = useUsersLazyQuery({
onCompleted: (data) => {
if(onCompleted){
onCompleted(data);
}
},
onError: onLoadUserError,
fetchPolicy: 'network-only',
});
const loadUsers = async (
phoneNumber: number,
) => {
const data = await usersQuery({
variables: {
where: {
OR: [
{ phoneNumber: newPhoneNumber }
],
},
},
});
return data;
};
return loadUsers;
};
export const useEditLocationName = (callback) => {
return (params) => async(favouritePlaceId, customisedName) => {
const [updateFavouritePlace] = useUpdateFavouritePlaceMutation({
onCompleted: () => {
if(callback){
callback(params)
}
Alert.alert('Name aktualisiert');
},
onError: () => {
Alert.alert('Oops, etwas ist schiefgelaufen');
},
});
updateFavouritePlace({
variables: {
favouritePlaceId: favouritePlaceId,
input: { customisedName: customisedName },
},
});
return null;
}
const editLocationName = useEditLocationName(setShowFlatList);
...
const handleSubmitForm = (
values: FormValues,
) => {
editLocationName(params)(route.params.favouritePlaceId, values.locationName)
};
/*
export const useEditLocationName = (callback) => {
const [updateFavouritePlace] = useUpdateFavouritePlaceMutation({
onCompleted: () => {
if(callback){
callback()
}
Alert.alert('Name aktualisiert');
},
onError: () => {
Alert.alert('Oops, etwas ist schiefgelaufen');
},
});
const editLocationName = async (
favouritePlaceId: number,
customisedName: string,
) => {
updateFavouritePlace({
variables: {
favouritePlaceId: favouritePlaceId,
input: { customisedName: customisedName },
},
});
return null;
};
return editLocationName;
};
*/
....
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.