# Vue3 直播班 vee-validate 4 問題紀錄

- 後台編輯商品，同樣商品點擊第二次編輯時，modal 中欄位消失。
- 詳細狀況: modal 欄位綁定 vee-validate ，透過編輯 button 連續開啟兩次同樣商品，modal 欄位會消失，若移除開啟 modal 時的 `this.$refs.form.resetForm();` 則可回覆正常。
- 6/24 每日問題 第七題 Jessie Cheng 同學的提問: https://hackmd.io/6qdh-B3ZTYKRNipSouQtVg

---

- 後台商品頁，點擊新增商品，再點擊編輯商品(任一)，會噴錯
- 詳細狀況: modal 欄位綁定 vee-validate ，點擊新增商品會使用 `xxx = {} ` 轉為空物件語法，導致 vee-validate 驗證的屬性無正確讀取因此出錯
- 解法:在新增商品的 `xxx = {}` 中補上驗證的屬性。
- 6/22 每日問題 第 2 題 Echo Hui 的提問: https://hackmd.io/kb50HM8RRlyxs0elRcvuyQ

---
- 上傳圖片 input 使用 vee-validate 驗證
- - 6/22 每日問題，第6題 Jordan_Tseng 同學的提問: https://hackmd.io/UpFBaRN6SMK0liw57h-Row?view
- 由於 vee-validate 的 <Field> 標籤無法使用 ref 獲取，但卻可以使用 slot 替換因此可寫成:

<Field name="求職照片">
 <input
   id="costumerInfoPersonalImg"
   type="file"
   class="form-control"
   :class="{ 'is-invalid': errors['求職照片'] }"
   placeholder="請選擇照片上傳"
   ref="costumerInfoPersonalImg"
 />
</Field>