Skip to content

Commit 028745b

Browse files
authored
Example updated to Svelte 5
1 parent a9c8ed8 commit 028745b

File tree

1 file changed

+5
-3
lines changed

1 file changed

+5
-3
lines changed

README.md

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -237,7 +237,7 @@ async function submitForm(e: Event) {
237237

238238
## Toast messages, event-style
239239

240-
A common use case for flash messages is to show a toast notification, but a toast is more like an event than data that should be displayed on the page, as we've done previously. But you can use the `flash` store as an event handler with a reactive statement:
240+
A common use case for flash messages is to show a toast notification, but a toast is more of an event than data that should be displayed on the page, as we've done previously. But you can use the `flash` store in an [$effect](https://svelte.dev/docs/svelte/$effect) to handle this:
241241

242242
**src/routes/+layout.svelte**
243243

@@ -248,14 +248,16 @@ import toast, { Toaster } from 'svelte-french-toast';
248248

249249
const flash = getFlash(page);
250250

251-
$: if ($flash) {
251+
$effect(() => {
252+
if (!$flash) return;
253+
252254
toast($flash.message, {
253255
icon: $flash.type == 'success' ? '' : ''
254256
});
255257

256258
// Clear the flash message to avoid double-toasting.
257259
$flash = undefined;
258-
}
260+
});
259261
```
260262

261263
## Flash message options

0 commit comments

Comments
 (0)