VueX가 어레이 데이터를 상태 그대로 교체합니다.

VueX가 어레이 데이터를 상태 그대로 교체합니다.

어떻게 설명해야 할지 모르겠으니 한번 해보자.저는 VueX의 가능성을 배우고 있을 뿐이니 조금만 참아주세요.

라는 이름의 상태 객체 배열이 있습니다.currentRoom한 번에 하나의 물체만 담을 수 있습니다.따라서 이름에서 사용자가 방 안에 있는 것을 의미하며, 그 후 방을 변경하므로 current Room은 데이터를 새 방으로 변경해야 합니다.지금은 점점 더 커지고 있는 오브젝트만 더해져요.

목표를 달성하려면 무엇을 변경해야 합니까?

export const actions = {
    [types.CURRENT_ROOM]({state, commit}, room) {
        commit(types.CURRENT_ROOM, {room});
    },
}

export const mutations = {
    [types.CURRENT_ROOM](state, {room}) {
        state.currentRoom.push(room)
    },
}

export const types = {
    CURRENT_ROOM: 'current_room'
}

VUE 파일 내에서 사용하고 있는 코드

this.$store.dispatch(RoomTypes.CURRENT_ROOM, room);

내 머릿속에서는 디스패치 대신 REPLACE 같은 것이 있어야 할 것 같기도 하고, 잘못 생각하고 있는 것일 수도 있습니다.그러니 나를 Stack Overflow에서 훌륭한 사람들 교육시키고 교육시켜줘!

측면 메모: Vue 3 및 VueX 4

전화를 걸기 때문에 어레이가 커집니다.Array.prototype.push()항목을 배열에 추가합니다.단일 요소 어레이를 가정할 경우 각 괄호를 사용하여 어레이 요소를 교체할 수 있습니다.0어레이 인덱스의 경우:

// store.js
export const mutations = {
    [types.CURRENT_ROOM](state, {room}) {
        state.currentRoom[0] = room
    },
}

다만, 어레이는 복수의 값을 보관 유지하는 것을 목적으로 하고 있습니다.값이 1개뿐이라면 어레이는 필요 없습니다.

state.currentRoom에서 변경되어야 한다Array에 대해서Object:

// store.js
export const state = () => ({
    currentRoom: {} // or null
})

그리고 이 변환은 새로운 값을 할당해야 합니다.state.currentRoom:

// store.js
export const mutations = {
    [types.CURRENT_ROOM](state, {room}) {
        state.currentRoom = room
    },
}

언급URL : https://stackoverflow.com/questions/69413140/vuex-replace-array-data-in-state