Merge pull request #114 from oetiker/patch-1

make sveltekit look more idiomatic
This commit is contained in:
Vadim
2022-09-03 13:19:31 +03:00
committed by GitHub

View File

@@ -62,28 +62,25 @@ const config = {
```jsx ```jsx
<script> <script>
import { onMount } from 'svelte'; import Carousel from 'svelte-carousel';
import { browser } from '$app/env';
let Carousel; // for saving Carousel component class
let carousel; // for calling methods of the carousel instance let carousel; // for calling methods of the carousel instance
onMount(async () => {
const module = await import('svelte-carousel');
Carousel = module.default;
});
const handleNextClick = () => { const handleNextClick = () => {
carousel.goToNext() carousel.goToNext()
} }
</script> </script>
<svelte:component {#if browser}
this={Carousel} <Carousel
bind:this={carousel} bind:this={carousel}
> >
<div>1</div> <div>1</div>
<div>2</div> <div>2</div>
<div>3</div> <div>3</div>
</svelte:component> </Carousel>
{/if}
<button on:click={handleNextClick}>Next</button> <button on:click={handleNextClick}>Next</button>
``` ```