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
Copy file name to clipboardExpand all lines: apps/svelte.dev/content/docs/kit/20-core-concepts/60-remote-functions.md
+4-2Lines changed: 4 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -504,9 +504,11 @@ Now simply call `addLike`, from (for example) an event handler:
504
504
505
505
> [!NOTE] Commands cannot be called during render.
506
506
507
-
### Single-flight mutations
507
+
### Updating queries
508
+
509
+
To update `getLikes(item.id)`, or any other query, we need to tell SvelteKit _which_ queries need to be refreshed (unlike `form`, which by default invalidates everything, to approximate the behaviour of a native form submission).
508
510
509
-
As with forms, any queries on the page (such as `getLikes(item.id)` in the example above) will automatically be refreshed following a successful command. But we can make things more efficient by telling SvelteKit which queries will be affected by the command, either inside the command itself...
@@ -1928,14 +1932,16 @@ The return value of a remote `command` function. See [Remote functions](/docs/ki
1928
1932
<divclass="ts-block">
1929
1933
1930
1934
```dts
1931
-
type RemoteCommand<Input, Output> = (arg: Input) => Promise<
1932
-
Awaited<Output>
1933
-
> & {
1934
-
updates(
1935
-
...queries: Array<
1936
-
RemoteQuery<any> | RemoteQueryOverride
1937
-
>
1938
-
): Promise<Awaited<Output>>;
1935
+
type RemoteCommand<Input, Output> = {
1936
+
(arg: Input): Promise<Awaited<Output>> & {
1937
+
updates(
1938
+
...queries: Array<
1939
+
RemoteQuery<any> | RemoteQueryOverride
1940
+
>
1941
+
): Promise<Awaited<Output>>;
1942
+
};
1943
+
/** The number of pending command executions */
1944
+
get pending(): number;
1939
1945
};
1940
1946
```
1941
1947
@@ -1991,6 +1997,8 @@ type RemoteForm<Result> = {
1991
1997
): Omit<RemoteForm<Result>, 'for'>;
1992
1998
/** The result of the form submission */
1993
1999
get result(): Result | undefined;
2000
+
/** The number of pending submissions */
2001
+
get pending(): number;
1994
2002
/** Spread this onto a `<button>` or `<input type="submit">` */
1995
2003
buttonProps: {
1996
2004
type: 'submit';
@@ -2016,6 +2024,8 @@ type RemoteForm<Result> = {
2016
2024
formaction: string;
2017
2025
onclick: (event: Event) => void;
2018
2026
};
2027
+
/** The number of pending submissions */
2028
+
get pending(): number;
2019
2029
};
2020
2030
};
2021
2031
```
@@ -2050,7 +2060,7 @@ type RemoteQuery<T> = RemoteResource<T> & {
2050
2060
*/
2051
2061
refresh(): Promise<void>;
2052
2062
/**
2053
-
* Temporarily override the value of a query. This is used with the `updates` method of a [command](https://svelte.dev/docs/kit/remote-functions#command-Single-flight-mutations) or [enhanced form submission](https://svelte.dev/docs/kit/remote-functions#form-enhance) to provide optimistic updates.
2063
+
* Temporarily override the value of a query. This is used with the `updates` method of a [command](https://svelte.dev/docs/kit/remote-functions#command-Updating-queries) or [enhanced form submission](https://svelte.dev/docs/kit/remote-functions#form-enhance) to provide optimistic updates.
0 commit comments