-
Notifications
You must be signed in to change notification settings - Fork 2.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Mutations article edits for 3.4 #8265
Conversation
This will be a huge help to our team, thank you. |
@StephenBarlow As I'm working on this article, I noticed we're using React refs in a slightly strange way. Do you think this kind of change is a good idea, or is it more confusing for folks who don't know about diff --git a/docs/source/data/mutations.mdx b/docs/source/data/mutations.mdx
index 9ed27e9b4..25a3e227a 100644
--- a/docs/source/data/mutations.mdx
+++ b/docs/source/data/mutations.mdx
@@ -73,7 +73,7 @@ Next, we'll create a component named `AddTodo` that represents the submission fo
```jsx{3,13}:title=add-todo.jsx
function AddTodo() {
- let input;
+ const inputRef = useRef();
const [addTodo, { data, loading, error }] = useMutation(ADD_TODO);
if (loading) return 'Submitting...';
@@ -84,15 +84,12 @@ function AddTodo() {
<form
onSubmit={e => {
e.preventDefault();
+ const input = inputRef.current;
addTodo({ variables: { text: input.value } });
input.value = '';
}}
>
- <input
- ref={node => {
- input = node;
- }}
- />
+ <input ref={inputRef} />
<button type="submit">Add Todo</button>
</form>
</div>
|
45980d3
to
ea2f399
Compare
ea2f399
to
8c2f8ae
Compare
8c2f8ae
to
1236938
Compare
@StephenBarlow I enabled the Netlify previews for any PR targeting |
ac7238a
to
7e1a497
Compare
7e1a497
to
3a7576c
Compare
30eaea4
to
f87dbf5
Compare
docs/source/data/mutations.mdx
Outdated
|
||
> Thankfully, although GraphQL mutations can have arbitrary effects on the server, a GraphQL client only needs to worry about mutation effects that can be later observed by refetching GraphQL queries. | ||
However, an `update` function might get this replication _wrong_ by setting a cached value incorrectly. You can "double check" your `update` function's modifications by refetching affected active queries on your GraphQL server. To specify _which_ active queries you want to refetch, provide the `onQueryUpdated` option to your mutate function: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@StephenBarlow This last sentence seems a bit misleading: onQueryUpdated
by itself is never the cause of a query being refetched, but merely a way of intercepting/filtering queries that were affected by the mutation's update
function or included in the refetchQueries
array. I don't think this confusion spills over into other parts of this documentation, so I believe this sentence can be reworded in place.
If that's not enough information to figure out the right wording, I'm happy (as always) to answer questions, but you might also want to read through the Refetch recipes section that I just added, to get a feeling for the relationship between the different client.refetchQueries
options.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Content looks complete to me, though I'm sure there are some formatting tweaks (especially for the tables I added) that we can continue iterating on (either here or in follow-up PRs). Thanks @StephenBarlow!
Interesting (re: that Netlify build failure)… broken links don't show up for the commit that breaks them, but in the following commit (I think). I'll push a fix momentarily. |
https://app.netlify.com/sites/apollo-client-docs/deploys/60f9c9f09e186b000846394e #8265 (comment) Strange because the link does render correctly and go to the right place. Perhaps the broken link detector doesn't understand #anchors within tables?
No description provided.