關於vue的v-model的自己理解

1.在一般使用情況下，v-model為：

<input v-model="searchText">

等價於

<input v-bind:value="searchText" v-on:input="searchText = $event.target.value">

2.在元件中，v-model為：

<custom-input v-model="searchText"></custom-input>

等價於

<custom-input v-bind:value="searchText"
 
 v-on:input="searchText = arguments[0]"></custom-input>

一個元件上的 v-model 預設會利用名為 value 的 prop 和名為 input 的事件，但是像單選框、複選框等型別的輸入控制元件可能會將 value 特性用於不同的目的。model 選項可以用來避免這樣的衝突：

Vue.component('base-checkbox', {
  model: {
    prop: 'checked',
    event: 'change'
  },
  props: {
    checked: Boolean
  },
  template: `
    <input
      type
 
="checkbox"
      v-bind:checked="checked"
      v-on:click="$emit('change', $event.target.checked)"
    >
  `
})

新增model後相當於把value和input替換掉了

<base-checkbox v-bind:checked="checked" v-on:change="checked=arguments[0]"></base-checkbox>