Vue-表單提交

template

<form @submit.prevent="submitFrom">
<!-- 註冊提交事件 .prevent 阻止表單的默認提交行爲 --> 簡單輸入: <input type="text" v-model="formData.name"> 單選：
<input type="radio" v-model="formData.open" value="1"> 開 <input type="radio" v-model="formData.open" value="0"> 關 多選: <input type="checked" v-model="formData.huolg"/> 火龍果 <input type="checked" v-model="formData.yezi"/> 椰子 下拉選擇框: <select v-model="formData.weidao">
<option value="xl">香辣</option>
<option value="ml">麻辣</option>
<option value="qt">清湯</option>
<option value="yy">鴛鴦</option>
</select>
<button type="submit" value="肯定"></button>
</form>

script

export default { data() { return { formData: { name: "", opn: "", huolg: "", yezi: "", weidao: "", } }; }, methods: { submitFrom() { console.log(this.formData); } }, }