React-apollo:更改变量而无需在轮询查询中重新获取

时间:2018-07-09 11:11:18

标签: javascript reactjs graphql react-apollo apollo-client

有没有办法让我们可以更改查询中的变量而无需重新引用?

我的用例是,如果您有一个轮询查询,并且想根据用户的操作跳过或包括查询的一部分。

例如

const USER_STATS = gql`
query userStats($withDetailedStats:Boolean!){
    user{
        stats{
            ...stats
        }
        detailedStats@include(if:$withDetailedStats){
            ...detailedStats
        }
    }
}
`;

class Example extends React.PureComponent {
    render() {
        return (
            <Query query={query} 
                  variables={{ withDetailedStats: false }} 
                   pollInterval={5000}>
                {
                    ({ data, refetch, loading }) => {
                        if (loading) { return 'Loading...'; }
                        const {
                            user
                        } = data;
                        return (
                            <div>
                                <div>{user && user.stats}</div>
                                <Button onClick={this.openModal}>More Details</Button>
                                <Modal
                                    onOpen={() => { refetch({ withDetailedStats: true }); }} 
                                    onClose={() => { setVariablesWithoutRefetching({ withDetailedStats: false }); }} >
                                    <div>{user && user.detailedStats}</div>
                                </Modal>
                            </div>
                        );
                    }
                }
            </Query>
        );
    }
}

0 个答案:

没有答案