Apollo Mutation 不识别变量
Apollo Mutation does not recognize variables
我正在关注 Apollo [Mutation DOC][1],我唯一改变的是我有一个“Speaker
”和三个参数,但是,它在尝试时给出了这个错误给一个“addSpeaker
”:
[
{
"message": "The field `bio` does not exist on the type `AddSpeakerPayload`.",
"locations": [
{
"line": 3,
"column": 5
}
],
"path": [
"addSpeaker"
],
"extensions": {
"type": "AddSpeakerPayload",
"field": "bio",
"responseName": "bio",
"specifiedBy": "http://spec.graphql.org/October2021/#sec-Field-Selections-on-Objects-Interfaces-and-Unions-Types"
}
},
{
"message": "The field `name` does not exist on the type `AddSpeakerPayload`.",
"locations": [
{
"line": 4,
"column": 5
}
],
"path": [
"addSpeaker"
],
"extensions": {
"type": "AddSpeakerPayload",
"field": "name",
"responseName": "name",
"specifiedBy": "http://spec.graphql.org/October2021/#sec-Field-Selections-on-Objects-Interfaces-and-Unions-Types"
}
},
{
"message": "The field `webSite` does not exist on the type `AddSpeakerPayload`.",
"locations": [
{
"line": 5,
"column": 5
}
],
"path": [
"addSpeaker"
],
"extensions": {
"type": "AddSpeakerPayload",
"field": "webSite",
"responseName": "webSite",
"specifiedBy": "http://spec.graphql.org/October2021/#sec-Field-Selections-on-Objects-Interfaces-and-Unions-Types"
}
},
{
"message": "The argument `bio` does not exist.",
"locations": [
{
"line": 2,
"column": 14
}
],
"extensions": {
"type": "Mutation",
"field": "addSpeaker",
"argument": "bio",
"specifiedBy": "http://spec.graphql.org/October2021/#sec-Required-Arguments"
}
},
{
"message": "The argument `name` does not exist.",
"locations": [
{
"line": 2,
"column": 25
}
],
"extensions": {
"type": "Mutation",
"field": "addSpeaker",
"argument": "name",
"specifiedBy": "http://spec.graphql.org/October2021/#sec-Required-Arguments"
}
}
]
前端 POC 代码:
const Container = () => {
const EXCHANGE_RATES = gql`
query GetSpeakersAndChocolates {
getSpeakers : speakers {
id,
name,
bio,
webSite
}
},
`;
const ADD_SPEAKERS = gql`
mutation AddSpeakers($name: String!, $bio: String, $webSite: String) {
addSpeaker(
bio: $bio,
name: $name,
webSite: $webSite
) {
bio
name
webSite
}
}
`;
const [getSpeakers2, { loading, error, data }] = useLazyQuery(EXCHANGE_RATES);
const [addSpeaker, mutateObj] = useMutation(ADD_SPEAKERS);
return (
<DIV>
{/* {networkStatus === NetworkStatus.refetch && <h1 style={{ color: 'red' }}>Refetching!</h1>} */}
{loading && <h1>CARREGANDO</h1>}
{error && <h1>DEU PAU</h1>}
<div style={{ display: 'flex', flexDirection: 'column' }}>
{data?.getSpeakers.map(({
id, name, bio, webSite,
}: any) => (
<span key={id}>
{name}
-
{bio}
-
{webSite}
</span>
))}
</div>
<button onClick={() => getSpeakers2()}>Refetch!</button>
<button onClick={() => addSpeaker({ variables: { name: 'oi', bio: 'ae', webSite: 'boa' } })}
>
ADD SPEAKERS!
</button>
</DIV>
);
};
后端 POC 代码:
型号:
namespace XP.POC.GraphQL.API.Models
{
public class Speaker
{
public int Id { get; set; }
[Required]
[StringLength(200)]
public string Name { get; set; }
[StringLength(4000)]
public string Bio { get; set; }
[StringLength(1000)]
public virtual string WebSite { get; set; }
}
}
查询
namespace XP.POC.GraphQL.API.GraphQL.Queries.Speakers
{
public class Query
{
public IQueryable<Speaker> GetSpeakers([Service] ApplicationDbContext context) =>
context.Speakers;
}
}
突变:
namespace XP.POC.GraphQL.API.GraphQL.Mutations.Speakers
{
public record AddSpeakerInput(
string Name,
string Bio,
string WebSite);
}
namespace XP.POC.GraphQL.API.GraphQL.Mutations.Speakers
{
public class AddSpeakerPayload
{
public AddSpeakerPayload(Speaker speaker)
{
Speaker = speaker;
}
public Speaker Speaker { get; }
}
}
namespace XP.POC.GraphQL.API.GraphQL.Mutations.Speakers
{
public class Mutation
{
public async Task<AddSpeakerPayload> AddSpeakerAsync(AddSpeakerInput input,
[Service] ApplicationDbContext context)
{
var speaker = new Speaker
{
Name = input.Name,
Bio = input.Bio,
WebSite = input.WebSite
};
context.Speakers.Add(speaker);
await context.SaveChangesAsync();
return new AddSpeakerPayload(speaker);
}
}
}
[1]: https://www.apollographql.com/docs/react/data/mutations/#include-modified-objects-in-mutation-responses
试试这个:
mutation AddSpeaker($name: String!, $bio:String, $webSite: String) {
addSpeaker(input: {name: $name, bio: $bio, webSite: $webSite})
{
speaker {
id
name
bio
webSite
}
}
}
我正在关注 Apollo [Mutation DOC][1],我唯一改变的是我有一个“Speaker
”和三个参数,但是,它在尝试时给出了这个错误给一个“addSpeaker
”:
[
{
"message": "The field `bio` does not exist on the type `AddSpeakerPayload`.",
"locations": [
{
"line": 3,
"column": 5
}
],
"path": [
"addSpeaker"
],
"extensions": {
"type": "AddSpeakerPayload",
"field": "bio",
"responseName": "bio",
"specifiedBy": "http://spec.graphql.org/October2021/#sec-Field-Selections-on-Objects-Interfaces-and-Unions-Types"
}
},
{
"message": "The field `name` does not exist on the type `AddSpeakerPayload`.",
"locations": [
{
"line": 4,
"column": 5
}
],
"path": [
"addSpeaker"
],
"extensions": {
"type": "AddSpeakerPayload",
"field": "name",
"responseName": "name",
"specifiedBy": "http://spec.graphql.org/October2021/#sec-Field-Selections-on-Objects-Interfaces-and-Unions-Types"
}
},
{
"message": "The field `webSite` does not exist on the type `AddSpeakerPayload`.",
"locations": [
{
"line": 5,
"column": 5
}
],
"path": [
"addSpeaker"
],
"extensions": {
"type": "AddSpeakerPayload",
"field": "webSite",
"responseName": "webSite",
"specifiedBy": "http://spec.graphql.org/October2021/#sec-Field-Selections-on-Objects-Interfaces-and-Unions-Types"
}
},
{
"message": "The argument `bio` does not exist.",
"locations": [
{
"line": 2,
"column": 14
}
],
"extensions": {
"type": "Mutation",
"field": "addSpeaker",
"argument": "bio",
"specifiedBy": "http://spec.graphql.org/October2021/#sec-Required-Arguments"
}
},
{
"message": "The argument `name` does not exist.",
"locations": [
{
"line": 2,
"column": 25
}
],
"extensions": {
"type": "Mutation",
"field": "addSpeaker",
"argument": "name",
"specifiedBy": "http://spec.graphql.org/October2021/#sec-Required-Arguments"
}
}
]
前端 POC 代码:
const Container = () => {
const EXCHANGE_RATES = gql`
query GetSpeakersAndChocolates {
getSpeakers : speakers {
id,
name,
bio,
webSite
}
},
`;
const ADD_SPEAKERS = gql`
mutation AddSpeakers($name: String!, $bio: String, $webSite: String) {
addSpeaker(
bio: $bio,
name: $name,
webSite: $webSite
) {
bio
name
webSite
}
}
`;
const [getSpeakers2, { loading, error, data }] = useLazyQuery(EXCHANGE_RATES);
const [addSpeaker, mutateObj] = useMutation(ADD_SPEAKERS);
return (
<DIV>
{/* {networkStatus === NetworkStatus.refetch && <h1 style={{ color: 'red' }}>Refetching!</h1>} */}
{loading && <h1>CARREGANDO</h1>}
{error && <h1>DEU PAU</h1>}
<div style={{ display: 'flex', flexDirection: 'column' }}>
{data?.getSpeakers.map(({
id, name, bio, webSite,
}: any) => (
<span key={id}>
{name}
-
{bio}
-
{webSite}
</span>
))}
</div>
<button onClick={() => getSpeakers2()}>Refetch!</button>
<button onClick={() => addSpeaker({ variables: { name: 'oi', bio: 'ae', webSite: 'boa' } })}
>
ADD SPEAKERS!
</button>
</DIV>
);
};
后端 POC 代码: 型号:
namespace XP.POC.GraphQL.API.Models
{
public class Speaker
{
public int Id { get; set; }
[Required]
[StringLength(200)]
public string Name { get; set; }
[StringLength(4000)]
public string Bio { get; set; }
[StringLength(1000)]
public virtual string WebSite { get; set; }
}
}
查询
namespace XP.POC.GraphQL.API.GraphQL.Queries.Speakers
{
public class Query
{
public IQueryable<Speaker> GetSpeakers([Service] ApplicationDbContext context) =>
context.Speakers;
}
}
突变:
namespace XP.POC.GraphQL.API.GraphQL.Mutations.Speakers
{
public record AddSpeakerInput(
string Name,
string Bio,
string WebSite);
}
namespace XP.POC.GraphQL.API.GraphQL.Mutations.Speakers
{
public class AddSpeakerPayload
{
public AddSpeakerPayload(Speaker speaker)
{
Speaker = speaker;
}
public Speaker Speaker { get; }
}
}
namespace XP.POC.GraphQL.API.GraphQL.Mutations.Speakers
{
public class Mutation
{
public async Task<AddSpeakerPayload> AddSpeakerAsync(AddSpeakerInput input,
[Service] ApplicationDbContext context)
{
var speaker = new Speaker
{
Name = input.Name,
Bio = input.Bio,
WebSite = input.WebSite
};
context.Speakers.Add(speaker);
await context.SaveChangesAsync();
return new AddSpeakerPayload(speaker);
}
}
}
[1]: https://www.apollographql.com/docs/react/data/mutations/#include-modified-objects-in-mutation-responses
试试这个:
mutation AddSpeaker($name: String!, $bio:String, $webSite: String) {
addSpeaker(input: {name: $name, bio: $bio, webSite: $webSite})
{
speaker {
id
name
bio
webSite
}
}
}