VueJS 將新對象推送到數組，數據不是響應式的

Question

這是我當前的數據結構

days: [
  {
    id: 0
    name: 'Monday',
    times: []
  },
  {
    id: 1
    name: 'Tuesday',
    times: []
  }
}

我正在使用以下方法將對象添加到時間數組。

onTimeAdded (dayId) {
  const dayIndex = this.days.findIndex(day => day.id === dayId)
  this.days[dayIndex].times.push({ from: '09:00', to: '18:00' })
}

這將對象添加到數組中，但是當我更改對象的屬性之一的值時，它不是反應性的，我定義對象的 from 和 to 屬性如下

<input
    type="time"
    name="to"
    :placeholder="To"
    :value="time.to"
>

如果我將一個對象添加到反應式數組，該對象的屬性是否是反應式的？

Answer 1

嘗試將input的value屬性更改為v-model ，並在占位符之前刪除無用的: 。

<input type="time" name="to" placeholder="To" v-model="time.to">