v-bind和v-model详解

说明

1. v-bind用来绑定数据和属性以及表达式，简写’:’

   // 绑定文本
   <p v-bind="message"></p>
    
   // 绑定属性
   <p :class="myClass"></p>
   

2. v-model指令在表单控件元素上创建双向数据绑定
   双向绑定 指的就是我们在js中的vue实例中的data与其渲染的dom元素上的内容保持一致，两者无论谁被改变，另一方也会相应的更新为相同的数据. 最基础的就是实现一个联动的效果

    <input type="radio" v-model="inpFruits" value="apple">
    <input type="radio" v-model="inpFruits" value="banana">
   <input type="radio" v-model="inpFruits" value="pear">
   

3. v-model 除了表单控件以外的标签是没有任何效果的

4. v-model其实是v-bind和v-on的语法糖

   <input v-model="something">
   <input v-bind:value="something" v-on:input="something = $event.target.value">
   /*这两行代码是等价得*/