我正在使用apollo的HoC来实现当前的突变,但是我对遇到的一些错误感到有些困惑:
这是我的查询
import gql from 'graphql-tag';
import { careTeamMember } from '../../fragments/careProvider';
const getFullMemberDetails = gql`
query getFullMemberDetails($id: ID!) {
member(id: $id) {
id
created_at
date_of_birth
first_name
last_name
name
email
phone
verified
informed_consent
// ....
}
}
${careTeamMember}`;
export default getFullMemberDetails;
这些是我的突变:
import gql from 'graphql-tag';
const updateMember = gql`
mutation UpdateMember($input: UpdateMemberInput!) {
updateMember(input: $input) {
success
member {
id
name
first_name
last_name
email
phone
date_of_birth
informed_consent
hipaa_privacy_policy
check_in_frequency_days
}
}
}
`;
export default updateMember;
import gql from 'graphql-tag';
const updateMemberInsurancePolicy = gql`
mutation UpdateMemberInsurancePolicy(
$member_id: ID!,
$carrier_name: String,
$insurance_member_id: String,
$insurance_group_id: String,
$plan_name: String,
) {
updateMemberInsurancePolicy(
member_id: $member_id,
carrier_name: $carrier_name,
insurance_member_id: $insurance_member_id,
insurance_group_id: $insurance_group_id,
plan_name: $plan_name,
) {
member_insurance_policy {
id
carrier_name
insurance_group_id
insurance_member_id
plan_name
member {
id
previsit {
id
can_schedule
}
}
}
success
}
}
`;
export default updateMemberInsurancePolicy;
并被这样使用
handleMemberSubmit = async (formData): Promise<any> => {
try {
const payload = {
id : this.props.data.member.id,
patch : {
first_name : formData.first_name,
last_name : formData.last_name,
date_of_birth : formData.date_of_birth,
phone : formData.phone,
// ....
payment_preference : formData.payment_preference ? 'OUT_OF_POCKET' : 'INSURANCE',
},
};
const insurancePayload = {
member_id : this.props.data.member.id,
carrier_name : formData.insurance_policy.carrier_name,
plan_name : formData.insurance_policy.plan_name,
insurance_group_id : formData.insurance_policy.insurance_group_id,
insurance_member_id : formData.insurance_policy.insurance_member_id,
};
const [
updateMemberResponse,
submitInsuranceResponse,
] = await Promise.all([
this.props.updateMember(payload),
this.props.submitInsurance(insurancePayload),
]);
const { data: { updateMember } } = updateMemberResponse;
const { data: { updateMemberInsurancePolicy } } = submitInsuranceResponse;
return this.props.addNotification('Member updated!', 'success');
} catch (err) {
return this.props.addNotification(getFirstError(err), 'error');
}
}
和HoC
graphql(getFullMemberDetails, {
options: (ownProps): Object => ({
id: ownProps.id,
}),
}),
graphql(updateMember, {
props: ({ mutate }): {updateMember: (input: Object) => Promise<any> } => ({
updateMember: (input): Promise<any> => mutate({
variables : { input },
options : (props): Object => ({
refetchQueries: [{
query : getFullMemberDetails,
variables : { id: props.id },
}],
}),
}),
}),
}),
graphql(updateMemberInsurance, {
props: ({ mutate }): {submitInsurance: () => {}} => ({
submitInsurance: (input): Promise<any> => mutate({
variables: { ...input },
}),
}),
}),
此异步方法可以正常工作,但是在这两个查询完成后,getFullMemberDetails
查询不会运行。
但是,当我将refetchQueries
移到HoC中的options
之外时,像这样:
graphql(updateMember, {
props: ({ mutate, ownProps }): {updateMember: (input: Object) => Promise<any> } => ({
updateMember: (input): Promise<any> => mutate({
variables : { input },
refetchQueries: [{
query : getFullMemberDetails,
variables : { id: ownProps.id },
}],
}),
}),
}),
我的getFullMemberDetails
运行,但出现这样的错误:
{"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"getFullMemberDetails"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"id"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"ID"}}}}],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"member"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"id"},"value":{"kind":"Variable","name":{"kind":"Name","value":"id"}}}],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"created_at"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"date_of_birth"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"first_name"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"last_name"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"name"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"email"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"phone"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"verified"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"informed_consent"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"postal_address"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"street_address_1"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"street_address_2"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"city"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"state"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"zip_code"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"country"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"user"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"time_zone"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"calendar"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"cohort"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"name"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"customer"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"name"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"basic_visits_covered"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"specialist_visits_covered"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"dependents_allowed"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"contract_term"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"start_at"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"end_at"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"in_person_supported"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"care_team"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"care_navigator"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Frabundle.esm.js:63)
at bundle.esm.js:1246
at bundle.esm.js:1558
at Set.forEach (<anonymous>)
at bundle.esm.js:1556
at Map.forEach (<anonymous>)
at QueryManager.push.../../../node_modules/apollo-client/bundle.esm.js.QueryManager.broadcastQueries (bundle.esm.js:1554)
at bundle.esm.js:1160
,我的缓存/道具未更新。我在做错什么吗?