首页 > 解决方案 > 如何使用关系参数过滤 GraphQL 查询,React Native

问题描述

我有一个 React Native App,它给了我一个属性列表。每个属性都有它自己的页面和一个屏幕链接,该屏幕列出了与该属性和该用户关联的所有注释。因此,用户只能在此屏幕上看到他们为此特定属性创建的注释。

我在编写获取与当前属性和当前用户关联的所有注释的 GraphQL 查询时遇到问题。

我的基本直觉是这样写...

const getNotes = gql`
  query getNotes {
    allPropertyNotes(filter: {
        AND: [{
            propertyId: ${this.props.navigation.state.params.id}
        }, {
            userId: ${this.props.screenProps.user.id}
        }]
    }, orderBy: createdAt_DESC) {
        id
        title
        body
    }
}
`;

但这似乎不起作用,因为查询是在组件之外定义的并且无权访问this.props(我假设)。

我的下一个虽然是这样做

const getNotes = gql`
  query getNotes($userId: ID!, $propertyId: ID!) {
    allPropertyNotes(filter: {
        AND: [{
            propertyId: $propertyId
        }, {
            userId: $userId
        }]
    }, orderBy: createdAt_DESC) {
        id
        title
        body
    }
}
`;

但我不确定如何将变量绑定到我需要它们的 ID。有关如何执行此操作的任何指示?

标签: react-nativegraphqlapollo-client

解决方案


如果您只需要“挂载查询”,那么只需<Query/>使用道具作为变量来渲染组件。带变量的示例

你可以用graphql() options.variables做同样的事情

传递查询(默认在开始时触发)和 [许多] 突变作为道具适用于更复杂的情况。文档

文档在这里并不冗长,您必须从许多地方/部分收集知识或搜索教程。


推荐阅读