Skip to content

Commit 2b6bcc8

Browse files
authored
Fix: SvelteKit other-handlers tutorial (#1086)
* Fix tutorial to work with immutable data prop * Remove extraneous $bindable rune on data prop
1 parent 5c49543 commit 2b6bcc8

File tree

2 files changed

+10
-4
lines changed
  • apps/svelte.dev/content/tutorial/03-sveltekit/07-api-routes/03-other-handlers

2 files changed

+10
-4
lines changed

apps/svelte.dev/content/tutorial/03-sveltekit/07-api-routes/03-other-handlers/+assets/app-b/src/routes/+page.svelte

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script>
2-
let { data = $bindable() } = $props();
2+
let { data } = $props();
33
</script>
44

55
<div class="centered">
@@ -26,11 +26,13 @@
2626

2727
const { id } = await response.json();
2828

29-
data.todos = [...data.todos, {
29+
const todos = [...data.todos, {
3030
id,
3131
description
3232
}];
3333

34+
data = { ...data, todos };
35+
3436
input.value = '';
3537
}}
3638
/>
@@ -63,7 +65,9 @@
6365
method: 'DELETE'
6466
});
6567

66-
data.todos = data.todos.filter((t) => t !== todo);
68+
const todos = data.todos.filter((t) => t !== todo);
69+
70+
data = { ...data, todos };
6771
}}
6872
></button>
6973
</label>

apps/svelte.dev/content/tutorial/03-sveltekit/07-api-routes/03-other-handlers/index.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,9 @@ We can now interact with this endpoint inside our event handlers:
5454
method: 'DELETE'
5555
});
5656
57-
data.todos = data.todos.filter((t) => t !== todo);+++
57+
const todos = data.todos.filter((t) => t !== todo);
58+
59+
data = { ...data, todos };+++
5860
}}
5961
></button>
6062
</label>

0 commit comments

Comments
 (0)