theonlychase
8/7/2019 - 11:48 PM

v-model

v-model under the hood

// with v-model
<input v-model="email" class="form-input" placeholder="you@example.com">

// without v-model
<input :value="email" @input="email = $event.target.value" class="form-input" placeholder="you@example.com">

data() {
  return {
    email: 'test@test.com'
  }
}

// Controlled Componenet
    - The value, or state, of the input is controlled by the parent
    - A component that doesn't have any of its own state, but is controlled by state in the parent
    - it communicates with the parent by firing events anytime the user has tried to change the value of the component