vue2 v-model 绑定不同的表单元素，绑定不同表单元素的属性

• 输入框 input:text --> value
• 文本域 textarea --> value
• 复选框 input:checkbox --> checked
• 单选框 input:radio --> checked
• 下拉菜单 select–> value

1、绑定输入框

input type='text' / 'password' / 'number'

<!--绑定的是 type='text' / password 的 value值 --> 
<div id ="root"> 
    <!-- trim修饰符去除前后空白 -->
  用户名：<input type="text" v-model.trim="username" />
  密码：  <input type="password" v-model="password" />
     <!-- number将字符串转为数据 -->
  年龄：  <input type="number" v-model.number="age" />
 </div> 
 <script src='https://cdn.jsdelivr.net/npm/vue@2.7.16/dist/vue.js'></script>
 <script>
   let vm = new Vue({
     
    el: '#root',
    data(){
     
      return {
     
          username:'',
          password:'',
          age:''
      }},
   })
 </script>

2、绑定单选框

input type="radio"

<div id ="root"> 
 <!-- 单选框使用v-model绑定同一个属性时，checked属性会失效，name属性可以省略，但是value属性必须要有 
     当 v-model 的属性值与某个单选框的 value 值相等时，Vue.js 会自动设置该单选框为选中状态 -->
性别：男：<input type="radio" name="sex" checked value=