我正在 Vuejs/Nuxtjs
中動態建立一些 datetime-local
類型的輸入欄位。我想將所有這些輸入欄位的預設值設定為 2022-04-21T14:27:27.000
。怎麼做?
對於直接字段,我們可以使用 v-model
分配值,但我有點不確定如何為 datetime-local
的所有字段設置預設值。如果我沒記錯的話,Vanilla JavaScript 中有一個選項可以取得某種類型的所有欄位並更改值,有沒有辦法使用 Vuejs/Nuxtjs
來實現相同的目的。
以下是我到目前為止的程式碼:
<template> <div> <button type="button" @click="addField" class="btn btn-info"> Add Field </button> <div v-for="field in fieldArray" :key="field.ID" class="form-group"> <input v-model="field.time" type="datetime-local" class="form-control" step="1" value="2022-04-21T14:27:27.000" @change="timeChange(field.ID)" /> </div> </div> </template> <script> export default { data() { return { fieldCount: 0, fieldArray: [], }; }, mounted() { let now = new Date(); now.setMinutes(now.getMinutes() - now.getTimezoneOffset()); now.setSeconds(now.getSeconds(), 0); now = now.toISOString().slice(0, -1); //I would like to set this "now" time value for all the created fields of input type datetime-local console.log("Current Time : " + now); }, methods: { //Add field addField() { const fieldObj = { ID: this.fieldCount, time: "" }; this.fieldArray.push(fieldObj); }, //Time change timeChange(ID) { console.log("ID : " + ID); console.log(JSON.stringify(this.fieldArray, null, 4)); }, }, }; </script> <style> </style>
我想要做的就是為我的元件中的所有 datetime-local
欄位設定預設時間。有什麼辦法可以做到嗎?我可以對單一欄位實現此目的,但不能對動態建立的欄位實現此目的。