Vuex: getters not working after passing around state

Question

I am working on this Vue and Vuex website and I made an update but that broke the getters that depend on the "selected" state. I narrowed it down to the call of SensorService.toggleSensor but I don't know what the problem could be.

I have an action like so:

async toggleSensor({ state, commit }, sensor) {
    let selected = await SensorService.toggleSensor(state.selected, sensor);

    console.log(selected);

    await commit('updateSelected', selected);
},

and this is SensorService.toggleSensor:

async toggleSensor(selected, sensor) {
    let deviceId = await store.dispatch('chart/getDeviceIdBySensorId', sensor.id);

    let deviceAlreadySelected = false;
    let sensorAlreadySelected = false;

    for (let devId in selected) {
        if (devId === deviceId) {
            deviceAlreadySelected = true;

            for (let i = 0; i < selected[deviceId].length; i++) {
                if (selected[deviceId][i].id === sensor.id) {
                    sensorAlreadySelected;

                    // unselect sensor in case of it already being selected
                    Vue.delete(selected[deviceId], i); 
                }
            }
        }
    }

    if (! deviceAlreadySelected) {
        selected[deviceId] = [sensor];
    }

    if (! sensorAlreadySelected && deviceAlreadySelected) {
        selected[deviceId].push(sensor);
    }

    return selected;
},

so when I replace await commit('updateSelected', selected); and hard code the data as in await commit('updateSelected', {"deviceid": [{id: 1522, type: "temp"}]}); everything works so apparently the problem is with the call to SensorService.toggleSensor I just don't know what it could be? Any ideas?

score 0 · Answer 1 · answered Sep 29 '22 at 14:58

0

Solved it by simplified deep cloning state.selected before passing it to SensorService.

Though why this is necessary, I have no idea! Anyone?

answered Sep 29 '22 at 14:58

Petar Vasilev

4,281
5
40
74

It has buggy behavior in this version. If you want to delete something in the state you need to pass records to the state except deleted records. It seems mutable/immutable issue. @Peter Vasilev – Batuhan Sep 29 '22 at 15:26
@Batuhan is there some more info on this somewhere I am having further issues with this? – Petar Vasilev Sep 30 '22 at 12:56
Now I can't delete sensors from `selected` inside the `SensorService` class for some reason. Bizarre. – Petar Vasilev Sep 30 '22 at 12:57

Vuex: getters not working after passing around state

1 Answers1