Laravel + Vuex: 개체/인수 분해가 작동하지 않습니다.

Laravel + Vuex: 개체/인수 분해가 작동하지 않습니다.

Vuex를 사용하여 Vue 애플리케이션을 구축하고 있는데 다음 코드가 작동하지 않습니다(간단하게 편집되어 이 블로그 게시물에서 영감을 받았습니다).

// File: views/Board.vue

export default {
    methods: {
        updateProp (prop, value) {
            console.log(prop, value) // Outputs prop and value

            this.$store.commit('board/updateProp', {
                [prop]: value
            })
        }
    },

    // ...
}

그리고 (이름이 붙은) Vuex 모듈에서:

// File: vuex/modules/board.js

export default {
    mutations: {
        updateProp (state, { prop, value }) {
            console.log(prop, value) // Outputs 'undefined undefined'
        }
    },

    // ...
}

왜냐면import { something } from 'somewhere'잘 작동합니다, 저는 물체 파괴가 효과가 있다고 믿는 경향이 있습니다.나는 왜 내 코드가 그렇지 않은지 당황스러울 뿐입니다.

또한 다음을 만들었습니다..babelrc다음과 같은 파일을 작성하고 각 플러그인과 사전 설정을 설치했지만, 사용할 수 없었습니다.

{
    "plugins": [
        "transform-es2015-destructuring",
        "transform-object-rest-spread"
    ],
    "presets": [
        ["es2015", { "modules": false }]
    ]
}

도움을 주셔서 대단히 감사합니다.

이것은 아마도 답이 아닐 것이지만, 코멘트에 맞추기에는 너무 어렵습니다.왜 둘 다prop그리고.value이다undefined그러나 그것은 파괴가 작동하는 방식이 아닙니다(그것은 객체의 키와 값을 풀지 않습니다).현재 설정은 다음을 포함하는 개체와 함께 호출하는 경우에만 작동합니다.prop키와 avalue키:

this.$store.commit('board/updateProp', { prop, value })

언급URL : https://stackoverflow.com/questions/45764121/laravel-vuex-object-argument-destructuring-not-working