List (with axios)

js·2022년 5월 23일
0

새로 알게 된 점

앞으로 api 데이터 받아오는 코드를 작성할 때 아래와 같은 구조로 작성하자 !!

// 템플릿
const printPosts = res => {
    const {data} = res;
    data.forEach(item => {
        const li = `<li>
                        <h2>${item.title}</h2>
                        <p>${item.body}</p>
                    </li>`;
        ul.insertAdjacentHTML("beforeend", li);
    })
}

// HTTP 통신
const fetchPosts = async () => {
    return await axios.get(API);
}

// api 호출하는 파트와 데이터 뿌려주는 파트로 분리 
const render = async (callApi, callTemplate) => {
    const res = await callApi();
    callTemplate(res);
}

0개의 댓글