vue实现v-model

子组件baseCheckbox.vue的写法

<template>
  <input
    type="checkbox"
    v-bind:checked="checked"
    v-on:change="$emit('change', $event.target.checked)"
  >
</template>

<script>
export default {
  name: 'baseCheckbox',
  model: {
    prop: 'checked',
    event: 'change'
  },
  props: {
    checked: Boolean
  }
}
</script>

<style scoped>

</style>

父组件的写法

// 参数lovingVue写在data里,默认为true
<base-checkbox v-model="lovingVue"></base-checkbox>

效果图