var blog = {
 name: 'haorooms博客'
};
console.log(blog.name); // haorooms博客

var blog= {}
var name = '';
Object.defineProperty(blog, 'name', {
 set: function (value) {
 name = value;
 console.log('欢迎来到' + value);
 },
 get: function () {
 return '《' + name + '》'
 }
})
blog.name = 'haorooms博客'; // 欢迎来到haorooms博客
console.log(blog.name); // 《haorooms博客》

<input v-model="haorooms" />
<input v-bind:value="haorooms" v-on:input="haorooms= $event.target.value" />

<input :value="haorooms" @input="haorooms= $event.target.value" />

<input v-model="haorooms" />

<input :value="haorooms" @input="haorooms= $event.target.value" />

 <template>
 <div id="demo">
 <test-model v-model="haorooms"></test-model>
 <span>{{haorooms}}</span>
</div>
</template>
<script>
  import testModel from 'src/components/testModel'
  export default {
   data(){
      return{
         haorooms: "haorooms"
      }
    },
    components: {
      testModel,
    }
  }
</script>
<style lang="scss" scoped>
</style>

<template>
<span>
   <input
    ref="input"
    :value="value"
    @input="$emit('balabala', $event.target.value)"
   >
  </span>
</template>
<script>
  export default {
    data(){
      return{
      }
    },
    props: ["value"],
    model: {
      prop: 'value',
      event: 'balabala'
    }
  }
</script>
<style lang="scss" scoped>
</style>

<input type="checkbox" v-model="haorooms" />

<input type="checkbox" :checked="status" @change="status = $event.target.checked" />

<my-checkbox v-model="haorooms"></my-checkbox>

<input 
        type="checkbox"
        <!--这里就不用 input 了，而是 balabala-->
        @change="$emit('balabala', $event.target.checked)"
        :checked="value"
       />
 export default {
    data(){
      return{
      }
    },
    props: ['checked'], //这里就不用 value 了，而是 checked
   model: {
     prop: 'checked',
     event: 'balabala'
    },
  }