Dandy Now!
728x90
반응형
방명록
[ 언어·프레임워크/Vue.js ]
[Vue.js] 카운트다운 서클 타이머 버튼 만들기
2024-10-04 11:39:09
1. 네이버 지도의 카운트다운 서클 타이머 버튼모니터링 서비스에 사용자가 새로고침 버튼을 클릭하지 않아도 일정 시간이 지나면 자동으로 최신의 정보를 서버에서 받아와 리렌더링 하는 기능이 필요했고, [그림 1]과 같은 네이버 지도앱의 카운트다운 서클 타이머 버튼이 적당해 보였다. 2. Vue.js용 컴포넌트 제작 및 적용[그림 2]는 Vue.js용으로 만든 카운트다운 서클 타이머 버튼 컴포넌트를 적용한 사례이다. 시간은 15초부터 시작하고 0초가 되면 refresh 아이콘이 시계방향으로 회전한 후 초기화된다. 0초가 되거나 버튼을 클릭하면 $emmit에 의해 부모 컴포넌트의 함수를 호출한다. 부모 컴포넌트의 함수에는 서버에 get 요청하는 코드를 적용할 수 있다. 아래 코드는 부모 코드에서 사용한 사례이..
NEW
prev
1
next
728x90
반응형
최신버전 안내
현재 적용된 Stroke 스킨의 버전이 최신버전이 아닙니다.
최신버전의 스킨 파일을 다운로드 받을 수 있는 페이지로 이동하시겠습니까?
(* 이 모달창은 블로그 관리자에게만 표시됩니다.)
30일 동안 열지 않음
예
티스토리툴바
Dandy Now!
구독하기