在promises的动作中使用commit将返回'Getters＆Setters'

Question

我正在使用Vuex的'actions'来通过API从我的数据库中获取。

它运作良好，我有一个console.log(jsonResponse)，显示正确的数据。

但是，当我将commit('updateQuestions', jsonResponse)添加到图片时，所有字段的返回值都是"Setters & Getters"

store.js:

mutations: {
    updateQuestionsInit: (state, payload) => {
        state.questions.init = payload
    }
},
actions: {
    onInit: async ({commit}) => {
        try {
        let response = await fetch('http://localhost:8080/api/mongo/initialforms')

            if (response.ok) {
                let jsonResponse = await response.json()
                console.log(jsonResponse)
                // Omitting the below line means it works.
                commit('updateQuestionsInit', jsonResponse)
            }
        }
        catch (error) {
            console.log('ERROR', error)
        }
    }
}

结果

Expected Results

[
    {
        id: 0,
        type: "dropdown",
        value: "sku",
    }, ...
]

Actual Results

[
    {
        id: Getter & Setter,
        type: Getter & Setter
        value: Getter & Setter,
        … 
    }, ...

]

为什么会发生这种情况？如何纠正？

Answer 1

你在使用Firefox吗？其他人也经历过类似的问题，但对他们来说，它似乎在使用chrome。显然，Firefox在控制台中显示“Setters＆Getters”，但基础值是正确的。

- >切换到Chrome并查看问题是否仍然存在。

---

参考

Vue Getter & Setter instead of the actual values in backend response

https://discourse.mozilla.org/t/webextension-apis-made-as-getter-setter-lazily-evaluating-to-functions-beware-of-mocking-for-unit-tests/30849