收集表單資料：

• 若<input type="text">，則v-model收集的是value值，使用者輸入的就是value值
• 若<input type="radio">，則v-model收集的是value值，且要給標籤配置value值
• 若<input type="checkbox">

1. 1. 沒有配置input的value屬性，那麼收集就是checked（勾選或未勾選，是布林值）
   2. 配置input的value屬性：

　　　　　　（1）v-model的初始值是非陣列，那麼收集的就是checked（勾選或未勾選，是布林值）
　　　　　　（2）v-model的初始值是陣列，那麼收集的就是value組成的陣列
　　備註：v-model的三個修飾符：
　　　　lazy：失去焦點的時候再收集資料
　　　　number：輸入字串轉為有效的數字
　　　　trim；輸入首位空格過濾

<template>
    <div>
        <form @submit.prevent="getFormData">
            賬號：<input type="text" v-model="account"><br><br>
            密碼：<input type="text" v-model="password"><br><br>
            <!-- 控制輸入的資訊為數字型別，最後再轉換為數值型 -->
            年齡：
 
<input type="number" v-model.number="age"><br><br>
            性別：男<input type="radio" name="sex" value="man" v-model="sex">
                 女<input type="radio" name="sex" value="woman" v-model="sex">
                 <br><br>
            愛好：學習<input type="checkbox" value='study' v-model="hobby">
                 打遊戲
 
<input type="checkbox" value="games" v-model="hobby">
                 吃飯<input type="checkbox" value="food" v-model="hobby">
                 <br><br>
            所屬校區：
            <select v-model="city">
                <option value="">請選擇校區</option>
                <option value="">北京</option>
                <option value="">上海</option>
                <option value="">深圳</option>
            </select>
            <br><br>
            其他資訊：
            <!-- change事件發生後才出現回撥 -->
            <textarea v-model.lazy="other" cols="30" rows="10"></textarea>
            <br><br>
            <input type="checkbox" v-model='agree'>
            閱讀並接受<a href="http://www.baidu.com">《使用者協議》</a>
            <br><br>
            <button >提交</button>
        </form>
        
    </div>
</template>
<script setup>
import {ref,reactive} from 'vue'
let account=ref('')
let password=ref('')
let sex=ref('man')
let age=ref()
let hobby=ref([])
let city=ref('')
let other=ref('')
let agree=ref('')
const getFormData=()=>{
    console.log(account,password,sex,hobby,city,other,agree);
}
</script>