비동기통신

망나니서·2022년 12월 31일
0

svelte

목록 보기
4/10
<script>
	let todoList = [];
	async function getTodos(){
		const url = 'https://jsonplaceholder.typicode.com/todos/';
		const res = await fetch(url);
		let resData = res.json();
		
		if(res.ok){
			console.log(resData);
			return resData;
		} else {
			throw new Error("error");
		}
	}
</script>

<div>
	<button on:click={() => todoList = getTodos()}>
		todoList 가져오기
	</button>
	
	{#await todoList}
		<p>
			loading
		</p>
	{:then items}
		<ul>
		{#each items as item}
			<li>{item.id}. {item.title}</li>
		{/each}
		</ul>
	{:catch error}
		<p style="color: red">
			{error.message}
	</p>
	{/await}
</div>
profile
개발자입니다.

0개의 댓글