source

VueJ가 새로운 개체를 어레이에 푸시하여 데이터가 반응하지 않음

factcode 2022. 8. 28. 09:30
반응형

VueJ가 새로운 개체를 어레이에 푸시하여 데이터가 반응하지 않음

현재 데이터 구조입니다.


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' })
}

이렇게 하면 개체가 배열에 추가되지만 개체의 속성 중 하나 값을 변경하면 반응하지 않습니다. 개체의 시작 및 끝 속성을 다음과 같이 정의합니다.

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

반응형 어레이에 개체를 추가하면 해당 개체의 속성이 반응형입니까?

를 변경해 보겠습니다.inputvalue의 재산.v-model불필요한 것을 제거한다.:플레이스 홀더 앞에 표시됩니다.

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

언급URL : https://stackoverflow.com/questions/57181912/vuejs-pushed-new-object-to-array-data-is-not-reactive

반응형