javascript - 突变有效载荷值始终 __ob__ ：观察者

Question

嗨，我是 Vue 和 Javascript 世界的新手，但我真的很想学习这两种语言。

现在我通过观看一些教程来学习，但我遇到了问题。我有一个使用这种方法的 Stock.vue 组件。

methods: {
        ...mapActions({ actionBuyStock: 'buyStockAction' }),
        buyStock() {
            const order = {
                stockId: this.stock.id,
                stockPrice: this.stock.price,
                quantity: this.quantity,
            };
            this.actionBuyStock(order);
            this.quantity = 0;
        },
    },

我使用 vuex 并创建一个模块来处理这个问题。在我的stocks.js 模块中，我有如下代码之类的操作

const actions = {
    buyStockAction({ commit }, order) {
        commit(types.BUY_STOCK, order);
    },
};

如果我执行 console.log(order)，我会得到正确的对象作为我的有效负载。

{stockId: 1, stockPrice: 110, quantity: 5}

但是在我提交 BUY_STOCK 突变后，我的有效负载（订单）返回ob：当我 console.log（订单）时的对象。

{__ob__: Observer}

这是我的突变看起来像

const state = {...},

const mutations = {
    [types.BUY_STOCK](order) {
        console.log(order);
        // const record = state.myStocks.find((element) => element.id === order.stockId);
        // if (record) {
        //     record.quantity += order.quantity;
        // } else {
        //     state.myStocks.push({
        //         id: order.stockId,
        //         quantity: order.quantity,
        //     });
        // }
        // state.funds -= order.stockPrice * order.quantity;
    },

我将 buyStock 动作stocks.js和 BUY_STOCK 突变放入portfolio.js 我尝试将所有动作和突变放入同一个文件，但它仍然返回ob : Object in mutation。你能告诉我我做错了什么吗？我真的不希望我的学习阶段停在这里。

const state = {...}

const mutations = {
        [types.BUY_STOCK](state, order) {
            console.log(order);
            // const record = state.myStocks.find((element) => element.id === order.stockId);
            // if (record) {
            //     record.quantity += order.quantity;
            // } else {
            //     state.myStocks.push({
            //         id: order.stockId,
            //         quantity: order.quantity,
            //     });
            // }
            // state.funds -= order.stockPrice * order.quantity;
        },
        
        // IF I PASSING STATE, IT WILL THROW AN LINTING ERROR (NO-SHADOW)
        // BECAUSE I ALREADY DECLARE STATE AS VARIABLE

无阴影掉毛错误

标签： javascriptvue.jsvue-componentvuex