我正在尝试使用'react-apollo'突变/查询组件在我的react应用程序中实现GraphQL突变/查询。查询本身和在服务器端都可以正常工作,但是通过'react-apollo'突变/查询发送变量时,我收到 POST http://localhost:4000/graphql 400(错误请求)。< / p>
这是服务器端我的架构的代码:
import { gql } from 'apollo-server-express';
export default gql`
type Edge {
node: [BusinessDevelopment!]
}
type PageInfo {
endCursor: String
hasNextPage: Boolean!
}
type BusinessDevelopmentResultCursor {
edges: Edge!
pageInfo: PageInfo!
}
type BusinessDevelopment {
id: ID!
firstName: String!
lastName: String!
phone: String!
email: String
state: State!
active: Boolean!
admin: Boolean!
regionAdmin: Boolean!
createdBy: User
createdOn: Date!
lastModifiedOn: Date!
department: String!
}
extend type Query {
allBusinessDevelopment(
cursor: String
limit: Int
byMe: Boolean
): BusinessDevelopmentResultCursor
}
`
这是我在客户端查询的代码:
import gql from 'graphql-tag'
import * as fragments from './../fragments'
export default gql`
query (
$cursor: String!,
$limit: Int!,
$byMe: Boolean!
) {
allBusinessDevelopment(
cursor: $cursor,
limit: $limit,
byMe: $byMe
) {
edges {
node {
...Emlpoyee
}
},
pageInfo {
endCursor,
hasNextPage
}
}
}
${fragments.employee}
`
这是我使用“ react-apollo”查询组件进行的查询:
import React from 'react'
import { Query } from 'react-apollo';
import { getPersonaleAllQuery } from '../../../../../graphql/remoteQueries'
const PersonaleAll = (me) => {
// ONLY BY admin
const currentUser = me.me;
if (currentUser.admin) {
return (
<>
<Query
query={getPersonaleAllQuery}
variables={{
cursor: 'null',
limit: 10,
byMe: false
}}
>
{({loading, error, data}) => {
if (loading) return <div>Loading...</div>
if (error) return <div>Error</div>
if (data) {
console.log(data);
}
}}
</Query>
</>
);
}
return <h3>Not authorise .!..</h3>
}
export default PersonaleAll;