2021-05-20

父组件index.vue,子组件CustomVMode.vue

1 在父组件中引入子组件。

<p>{{name}}</p>
    <CustomVModel v-model="name"></CustomVModel>

2.子组件CustomVMode.vue

<template>
  <input :value="text" type="text" @input="$emit('change', $event.target.value)" />
</template>

<script>
export default {
  name: "CustomVModel",
  model: {
    prop: "text",
    event: "change"
  },
  props: {
    text: {
      type: String,
      default: ""
    }
  }
};
</script>

3.解析：
（1）上面的input 使用了:value 而不是v-model
（2）上面的change和model的event对应起来。
（3）text属性对应起来。