在承诺中使用提交操作会返回“字母和字母”

Question

我正在使用Vuex的“操作”通过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)
        }
    }
}

结果

预期结果

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

实际结果

[
    {
        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