You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
To use the client it first needs to be initialzed with an endpoint. If your endpoint requires authentication you can provide it to the client by calling the setter `apiToken` on the `Client` class.
38
+
39
+
> For this example we will use the public GitHub API.
Creating a query, is as simple as creating a multiline string:
33
59
34
60
```dart
35
-
String readAllPeople = """
36
-
query ReadAllPeople {
37
-
allPeople(first: 4) {
38
-
people {
39
-
id
40
-
name
61
+
String readRepositories = """
62
+
query ReadRepositories(\$nRepositories) {
63
+
viewer {
64
+
repositories(last: \$nRepositories) {
65
+
nodes {
66
+
id
67
+
name
68
+
viewerHasStarred
69
+
}
41
70
}
42
71
}
43
72
}
44
73
"""
45
-
.replaceAll('\n', ' ');
74
+
.replaceAll('\n', ' ');
46
75
```
47
76
48
77
In your widget:
@@ -51,9 +80,11 @@ In your widget:
51
80
...
52
81
53
82
new Query(
54
-
queries.readAllPeople,
55
-
variables: {},
56
-
pollInterval: 10,
83
+
readRepositories, // this is the query you just created
84
+
variables: {
85
+
'nRepositories': 50,
86
+
},
87
+
pollInterval: 10, // optional
57
88
builder: ({
58
89
bool loading,
59
90
var data,
@@ -67,38 +98,55 @@ new Query(
67
98
return new Text('Loading');
68
99
}
69
100
70
-
// It can be either Map or List or Map
71
-
List people = data['allPeople']['people'];
101
+
// it can be either Map or List
102
+
List repositories = data['viewer']['repositories']['nodes'];
72
103
73
104
return new ListView.builder(
74
-
itemCount: people.length,
105
+
itemCount: repositories.length,
75
106
itemBuilder: (context, index) {
76
-
final item = people[index];
107
+
final repository = repositories[index];
77
108
78
-
return new Text(item['name']);
109
+
return new Text(repository['name']);
79
110
});
80
111
},
81
-
)
112
+
);
82
113
83
114
...
84
115
```
85
116
86
-
The StarWars API does not have mutations, but has the same syntax as a query where the first argument of the builder function is the mutation function. Just call it to trigger the mutations (Yeah we deliberetly stole this from react-apollo.)
117
+
### Mutations
118
+
119
+
Again first create the mutation string string:
120
+
121
+
```dart
122
+
String addStar = """
123
+
mutation AddStar(\$starrableId: ID!) {
124
+
addStar(input: {starrableId: \$starrableId}) {
125
+
starrable {
126
+
viewerHasStarred
127
+
}
128
+
}
129
+
}
130
+
"""
131
+
.replaceAll('\n', ' ');
132
+
```
133
+
134
+
The syntax for mutations fairly similar to those of a query. The only diffence is that the first argument of the builder function is the mutation function. Just call it to trigger the mutations (Yeah we deliberetly stole this from react-apollo.)
87
135
88
136
```dart
89
137
...
90
138
91
139
new Mutation(
92
-
'<YOUR_MUTATION_STRING>',
140
+
addStar,
93
141
builder: (
94
-
runMutation, {
142
+
runMutation, { // you can name it whatever you like
95
143
bool loading,
96
144
var data,
97
145
String error,
98
146
}) {
99
147
return new FloatingActionButton(
100
148
onPressed: () => runMutation({
101
-
<YOUR_PARAMETERS>
149
+
'starrableId': <A_STARTABLE_REPOSITORY_ID>,
102
150
}),
103
151
tooltip: 'Increment',
104
152
child: new Icon(Icons.edit),
@@ -123,7 +171,7 @@ Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds
123
171
124
172
<!-- ALL-CONTRIBUTORS-LIST:END -->
125
173
126
-
This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind welcome!
174
+
This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind are welcome!
0 commit comments