Vue v-model 문법

1. V-model 이란?

- 입력된 값을 data로 저장하는 vue 문법

- <input @input="num = $event.target.value"> 과 똑같다.

<input v-model="num">

 

2. 사용 예시

<template>

    <div :class="$style.menu">
        <p>{{ menu }}</p>
        <input v-model="num"/>
        <p> {{ price * num }} 원</p>
    </div>

</template>

<script>
export default {
    name: 'MenuList',
    data() {
        return {
            num : 0
        }
    },
    props: {
        menu: String,
        price: String,
    }
}
</script>