Vue 사용.여러 개의 중첩된 객체가 있는 객체에 설정

Vue 사용.여러 개의 중첩된 객체가 있는 객체에 설정

사용하려고 합니다.Vue.set()Vue 2의 상태 개체를 업데이트합니다.

오브젝트는 다음과 같습니다.

state: {
    entries: [
        // entry 1
        fields: {
            someProperties : ''
            // here I would like to add another property named 'googleInfos'
        }
    ], [
        // entry 2
        fields: {
            someProperties : ''
            // here I would like to add another property named 'googleInfos'

        }
    ]
}

지금까지, 이 돌연변이로 업데이트 하고 있었어.각 엔트리에 내용이 다르기 때문에 개별적으로 변환합니다.

ADD_GOOGLE_INFOS (state, {index, infos}) {
    state.entries[index].fields.googleInfos = infos
}

이제, 저는 이 시스템을Vue.set()변경 검출의 경고를 회피합니다.

문제는 적절한 추가 방법을 찾을 수 없다는 것입니다.

Vue.set()의 동작은 다음과 같습니다.

Vue.set(state.object, key, value)

그래서 해봤는데 잘 안 되는 것 같아요.state.entries[index]는 퍼스트랭크의 객체가 아닙니다.

Vue.set(state.entries[index], 'fields.googleInfos', infos)

하지만 이것 또한 작동하지 않습니다.

Vue.set(state.entries, '[index].fields.googleInfos', infos)

내가 뭘 잘못하고 있는지 아는 사람?

반응하지 않는 유일한 부분은 에 추가하려는 새 속성입니다.fields물건.

를 추가하려면googleInfos다음과 같이 변환으로 설정해야 합니다.

ADD_GOOGLE_INFOS (state, {index, infos}) {
    Vue.set(state.entries[index].fields, 'googleInfos', infos);
}

언급URL : https://stackoverflow.com/questions/50133893/using-vue-set-in-object-with-multiple-nested-objects