XeNote/posts/Code/Svelte/External Script Loader.md

47 lines
830 B
Markdown
Raw Normal View History

2020-11-30 11:29:34 +00:00
Bu yöntemi Stackoverflow'da [blindfish](https://stackoverflow.com/a/61979865/9351362) yazmış.
2020-11-28 16:36:28 +00:00
```html
// LibLoader.svelte
<svelte:head>
<script bind:this={script} src={url} />
</svelte:head>
<script>
import { onMount, createEventDispatcher } from 'svelte';
const dispatch = createEventDispatcher();
export let url;
let script;
onMount(async () => {
script.addEventListener('load', () => {
dispatch('loaded');
})
script.addEventListener('error', (event) => {
console.error("something went wrong", event);
dispatch('error');
});
});
</script>
```
<br/>
```html
// MyComponent.svelte
<LibLoader url="myExternalLib.js"
on:loaded="{onLoaded}" />
<script>
import LibLoader from './LibLoader.svelte';
function onLoaded() {
myExternalLib.doStuff();
}
</script>
```