dynamic card pull - basic with svelte
This commit is contained in:
@@ -1,2 +1,29 @@
|
||||
<h1>Welcome to SvelteKit</h1>
|
||||
<p>Visit <a href="https://svelte.dev/docs/kit">svelte.dev/docs/kit</a> to read the documentation</p>
|
||||
<script lang="ts">
|
||||
import { onMount } from 'svelte';
|
||||
import axios from 'axios';
|
||||
let cards = [];
|
||||
|
||||
async function loadCard() {
|
||||
const response = await fetch('http://localhost:8000/foreign/json/card.json');
|
||||
cards = [...cards, (await response.json())];
|
||||
//console.log(response);
|
||||
//console.log(cards);
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
loadCard();
|
||||
});
|
||||
</script>
|
||||
|
||||
<div>
|
||||
|
||||
<button onclick={loadCard}>Load Card</button>
|
||||
|
||||
{#each cards as card}
|
||||
<article>
|
||||
<header>{card.title}</header>
|
||||
<p>{card.content}</p>
|
||||
</article>
|
||||
{/each}
|
||||
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user