[vue.js] 반응성 변수 ref

사용자의 입력에 따라 값이 변할 수 있는 변수는 ref로 선언한다.

ref로 선언한 변수는 사용자의 입력에따라 값이 변하는 "반응성을 가진 변수"가 된다.

 

[예시]

<template>
  <input v-model="userInput" type="text">
  <p>{{ userInput }}</p>
</template>

<script>
import { ref } from 'vue';

export default {
  setup() {
    const userInput = ref(''); // 사용자의 입력을 저장할 반응성 변수

    return {
      userInput
    };
  }
}
</script>