gql_gapher 是一个用于 Flutter 的 GraphQL 客户端插件，它允许你在 Flutter 应用中轻松地进行 GraphQL 查询、变异和订阅操作。以下是如何在 Flutter 项目中使用 gql_gapher 的基本步骤。

1. 添加依赖

首先，你需要在 pubspec.yaml 文件中添加 gql_gapher 依赖。

dependencies:
  flutter:
    sdk: flutter
  gql_gapher: ^0.1.0  # 请检查最新版本

然后运行 flutter pub get 来安装依赖。

2. 初始化 GraphQL 客户端

在你的 Flutter 应用中，你需要初始化一个 GraphQL 客户端。通常，你可以在 main.dart 文件中进行初始化。

import 'package:gql_gapher/gql_gapher.dart';

void main() {
  final client = GraphQLClient(
    link: HttpLink('https://your-graphql-endpoint.com/graphql'),
    cache: GraphQLCache(),
  );

  runApp(MyApp(client: client));
}

3. 使用 GraphQL 客户端进行查询

在你的应用程序中，你可以使用 GraphQLClient 来执行 GraphQL 查询。以下是一个简单的查询示例：

import 'package:flutter/material.dart';
import 'package:gql_gapher/gql_gapher.dart';

class MyApp extends StatelessWidget {
  final GraphQLClient client;

  MyApp({required this.client});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('GraphQL Example'),
        ),
        body: QueryExample(client: client),
      ),
    );
  }
}

class QueryExample extends StatefulWidget {
  final GraphQLClient client;

  QueryExample({required this.client});

  @override
  _QueryExampleState createState() => _QueryExampleState();
}

class _QueryExampleState extends State<QueryExample> {
  String? result;

  @override
  void initState() {
    super.initState();
    fetchData();
  }

  Future<void> fetchData() async {
    const String query = '''
      query {
        getUser(id: 1) {
          id
          name
          email
        }
      }
    ''';

    final QueryOptions options = QueryOptions(document: gql(query));

    final QueryResult result = await widget.client.query(options);

    if (result.hasException) {
      print(result.exception);
    } else {
      setState(() {
        this.result = result.data.toString();
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Text(result ?? 'Loading...'),
    );
  }
}

4. 使用 GraphQL 客户端进行变异

你可以使用 GraphQLClient 来执行 GraphQL 变异操作。以下是一个简单的变异示例：

Future<void> mutateData() async {
  const String mutation = '''
    mutation {
      createUser(name: "John Doe", email: "john@example.com") {
        id
        name
        email
      }
    }
  ''';

  final MutationOptions options = MutationOptions(document: gql(mutation));

  final QueryResult result = await widget.client.mutate(options);

  if (result.hasException) {
    print(result.exception);
  } else {
    setState(() {
      this.result = result.data.toString();
    });
  }
}

5. 使用 GraphQL 客户端进行订阅

gql_gapher 还支持 GraphQL 订阅。以下是一个简单的订阅示例：

Future<void> subscribeData() async {
  const String subscription = '''
    subscription {
      userCreated {
        id
        name
        email
      }
    }
  ''';

  final SubscriptionOptions options = SubscriptionOptions(document: gql(subscription));

  final Stream<QueryResult> subscriptionStream = widget.client.subscribe(options);

  subscriptionStream.listen((QueryResult result) {
    if (result.hasException) {
      print(result.exception);
    } else {
      setState(() {
        this.result = result.data.toString();
      });
    }
  });
}

6. 错误处理

在执行 GraphQL 操作时，建议始终检查 QueryResult 中是否有异常，并相应地处理错误。

if (result.hasException) {
  print(result.exception);
}