[Vue.js 3] SWRV 처음 사용기

 

1. 설치

npm install --save swrv

 

 

 

2. 파일명.vue에 사용해보기

<script>
import useSWRV from "swrv";
const fetcher = (url) => fetch(url).then((r) => r.json());

export default {
	setup() {
	    const { data } = useSWRV( url, fetcher );
	    console.log(data)
        return {
            data
        }
	}
}
</script>

 

이렇게 하면 콘솔창에 받아온 데이터가 보이게 된다.

 

 

※ 주의 ※

이 상태로 새로고침을 하면 이상이 없는데

console.log(data.value)로 변경 후 새로고침하면 undefined 나온다.

 

    setTimeout(() => {
      console.log(data.value);
    }, 230);

 

이렇게 했을 때 콘솔이 정상 출력되는 것 보면 데이터 받아오는 시간보다 console 출력이 더 빠른 것으로 생각된다.

이건 데이터 받아올 때 까지 기다려야 할 것 같다.

참고 링크 : https://github.com/Kong/swrv/issues/105