vue自定义v-model

由于本质上v-model只是input的v-bind:value和v-on:input的语法糖

官方的案例和解释是这样的

标题

也就是说我们需要在子组件内部定义model和props

model里面的event值子组件的事件，prop值修改的值

比如说定义一个输入框组件

<template>
  <div class="em-input">
    <input type="text" @input="$emit('input',$event.target.value)" :value="value" />
  </div>
</template>
<script>
export default {
  name: "em-input",
  model:{
      event:'input',
      prop:'value'
  },
  props: {
    value:{
      type:String,
      default:''
    }
  }
};
</script>

 我们在父组件引入之间使用v-model就可以了

<