通过GRAPHQL订阅传递数据时,仅其中一个参数为null [英] Passing data through a GRAPHQL Subscription gives null on only one of the arguments

查看:44
本文介绍了通过GRAPHQL订阅传递数据时,仅其中一个参数为null的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有以下GRAPHQL订阅:

I have the following GRAPHQL subscription:

Schema.graphql
    type Subscription {
      booking: SubscriptionData
    }

    type SubscriptionData {
      booking: Booking!
      action: String
    }

这是解析程序订阅文件

Resolver/Subscription.js
const Subscription = {
  booking: {
    subscribe(parent, args, { pubsub }, info) {
      return pubsub.asyncIterator("booking");
    }
  }
};

export default Subscription;

然后我在有问题的突变上有以下代码

Then I have the following code on the Mutation in question

pubsub.publish("booking", { booking: { booking }, action: "test" });

我在前端(响应)有关注订阅文件

I have the follow subscription file in front end (React)

const getAllBookings = gql`
  query {
    bookings {
      time
      durationMin
      payed
      selected
      activity {
        name
      }
    }
  }
`;

const getAllBookingsInitial = {
  query: gql`
    query {
      bookings {
        time
        durationMin
        payed
        selected
        activity {
          name
        }
      }
    }
  `
};

class AllBookings extends Component {
  state = { allBookings: [] }

  componentWillMount() {
    console.log('componentWillMount inside AllBookings.js')
    client.query(getAllBookingsInitial).then(res => this.setState({ allBookings: res.data.bookings })).catch(err => console.log("an error occurred: ", err));
  }

  componentDidMount() {
    console.log(this.props.getAllBookingsQuery)
    this.createBookingsSubscription = this.props.getAllBookingsQuery.subscribeToMore(
      {
        document: gql`
          subscription {
            booking {
              booking { 
                time
                durationMin
                payed
                selected
                activity {
                  name
                   }
              }
              action
            }
          }
        `,
        updateQuery: async (prevState, { subscriptionData }) => {
          console.log('subscriptionData', subscriptionData)
          const newBooking = subscriptionData.data.booking.booking;
          const newState = [...this.state.allBookings, newBooking]
          this.setState((prevState) => ({ allBookings: [...prevState.allBookings, newBooking] }))
          this.props.setAllBookings(newState);
        }
      },
      err => console.error(err)
    );
  }
  render() {
    return null;
  }
}

export default graphql(getAllBookings, { name: "getAllBookingsQuery" })(
  AllBookings
);

我得到以下答复:

data: {
booking: {booking: {...} action: null}}

我知道我可能以某种方式设置了错误的订阅,但是我没有看到问题.

I get that I am probably setting up the subscription wrong somehow but I don't see the issue.

推荐答案

根据您的架构,返回的所需 data 应该如下所示:

Based on your schema, the desired data returned should look like this:

{
  "booking": {
    "booking": {
      ...
    },
    "action": "test"
  }
}

第一个 booking Subscription 上的字段,而第二个预订是SubscriptionData上的字段.传递给 publish 的对象应具有相同的形状(即应始终包含根目录订阅字段).

The first booking is the field on Subscription, while the second booking is the field on SubscriptionData. The object you pass to publish should have this same shape (i.e. it should always include the root-level subscription field).

pubsub.publish('booking', {
  booking: {
    booking,
    action: 'test',
  },
})

这篇关于通过GRAPHQL订阅传递数据时,仅其中一个参数为null的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆