<script setup>
import {ref} from 'vue';
const rf = ref(0);
</script>
<template>
{{ rf }}
<button @click="rf++">클릭</button>
</template>
<style scoped>
</style>
그러면 버튼을 클릭할 때 마다 {{ rf }} 영역의 값이 새로 고침되는 것을 볼 수 있다.
이 때 rf 값을 ref 객체로 생성한 이유는 VueJS 에서 값의 변경을 추적할 수 있게끔 하기 위함이다. 레퍼런스 값으로 구현된 변수들의 데이터가 수정되면 VueJS 가 추적하여 템플릿에도 반영을 해준다.
Whitmemit 개인 일지 블로그는 개인이 운영하는 정보 공유 공간으로 사용자의 민감한 개인 정보를 직접 요구하거나 요청하지 않습니다. 기본적인 사이트 방문시 처리되는 처리 정보에 대해서는 '사이트 처리 방침'을 참고하십시오. 추가적인 기능의 제공을 위하여 쿠키 정보를 사용하고 있습니다. Whitmemit 에서 처리하는 정보는 식별 용도로 사용되며 기타 글꼴 및 폰트 라이브러리에서 쿠키 정보를 사용할 수 있습니다.
이 자료는 모두 필수 자료로 간주되며, 사이트 이용을 하거나, 탐색하는 경우 동의로 간주합니다.