This is the code that runs https://bandolier.learnjsthehardway.com/ for you to review. It uses the https://git.learnjsthehardway.com/learn-javascript-the-hard-way/bandolier-template to create the documentation for the project.
https://bandolier.learnjsthehardway.com/
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
22 lines
740 B
22 lines
740 B
2 years ago
|
This demonstrates how to use the simple `Toasts` component, but it *also* shows how to use a function provided by a component in Svelte. The trick is to realize that functions are variables, and that Svelte will let you _bind_ variables. You then simply have to do:
|
||
|
|
|
||
|
|
```
|
||
|
|
let send_toast;
|
||
|
|
```
|
||
|
|
|
||
|
|
In your script, and in your use of the component (`Toasts`) bind it like this:
|
||
|
|
|
||
|
|
```
|
||
|
|
<Toasts bind:send_toast />
|
||
|
|
```
|
||
|
|
|
||
|
|
Now when the Toasts component is loaded it will set _your_ `send_toast` variable to the function so you can call it. In your component then you simple do:
|
||
|
|
|
||
|
|
```
|
||
|
|
export const send_toast = () => {
|
||
|
|
// code here
|
||
|
|
}
|
||
|
|
```
|
||
|
|
|
||
|
|
Which will export it like a variable, but set it to `const` so Svelte doesn't complain that you aren't using it.
|