Как менять динамически значения в массиве по условию?

Question

[Дмитрий]

Сильно не бейте, но опять на какой-то ерунде засыпался. В упор не понимаю где ошибся.
Есть объект - приходит в формате json по идее - из blade в vue.

{ "08:00 - 08:20": [ 0, 0, 0, 0, 0, 0, 0 ], "08:20 - 08:40": [ 0, 0, 0, 0, 0, 0, 0 ],

... и т.д.
Конечная задача в эти слоты подставить события. Понятно, что основную часть (вместо 0 я буду получать с сервера, но не об этом сейчас.

Вот сделал data.

data() {
        return {
           events: [
                { day: 1,  start: '08:20 - 08:40', title: 'event'},
                  { day: 3, start: '08:40 - 09:00', title: 'event' }
            ]}
    }

И тестовый метод - перебрать и подставить значения.

testslot(e) {
           // console.log('testslot', e.target.getAttribute('data-day'))
                Object.keys(this.calendardata).forEach(key=>{
            // console.log('key',key,Array.isArray(this.calendardata[key],this.calendardata[key]))
              console.log('key',key,this.calendardata[key])

            let event = this.events.find(x => x.start==key) // нахожу event по ключу в общем массиве - хотя это объект
            if (event) {
                this.calendardata[key][event.day]=event; //  "подставляю значение
            }
        });
        console.log(this.calendardata)
        }

все в консоль выводится правильно, но значения в таблице общей не меняются. Calendardata передается из blade как prop. Перезаписывал в data... ничего не меняется. Где я кнопку save и update не нажал?) Object.assign - не покоряется(

08:20 - 08:40: Array(7)
0: 0
1:
day: (...)
start: (...)
title: (...)

Answer 1

[Дмитрий Гололобов]

Почитайте про реактивность во vue. В документации очень доступно все написано. https://ru.vuejs.org/v2/guide/reactivity.html
Для замены значений в массиве вы можете воспользоваться минимум следующими способами:
1) Менять значение через splice:
this.array.splice(oldElementIndex, 1, newElement)
2) Менять значение через vue set:
this.$set(this.array, oldElementIndex, newElement)
3) Поменять весь массив разом, например через map:

this.array = this.array.map(el => {
    el.someParam = 1
     return el
})

Comments

[Дмитрий]

Да, спасибо. Совсем про это забыл. Сделал через map. Я постепенно и в ларавел перехожу на map, filters, но еще не очень уверенно. Постепенно унифицирую подходы.