vuex在actions 中调用 mutations 报错

Question

在actions中调用

 commit('mapSet',map1);

mutations中是

mapSet:(state,mymap)=>{
            state.mymap=mymap;
        },
        
   

其中map1是一个对象，即传入的参数是一个对象，调用的时候就会出现报错为

mapSet是在actions中的一个方法中调用的

 makeMymap:({ dispatch, commit,state })=>{
                var map1=new state.qq.maps.Map('mapArea');
                commit('mapSet',map1); 
        }

我加入了一个plugins，内容是

export default function myPlugin(store){
    //生成state快照
     let prevState=deepCopy(store.state)
    store.subscribe((mutation,state)=>{
        let nextState=deepCopy(state)
        console.log("prevState:"+prevState)
        console.log("nextState:"+nextState)
         prevState = nextState
    })
    //深拷贝
function deepCopy(o) {
    if (o instanceof Array) {
        var n = [];
        for (var i = 0; i < o.length; ++i) {
            n[i] = deepCopy(o[i]);
        }
        return n;
    } else if (o instanceof Function) {
        var n = new Function("return " + o.toString())();
        return n
    } else if (o instanceof Object) {
        var n = {}
        for (var i in o) {
            n[i] = deepCopy(o[i]);
        }
        return n;
    } else {
        return o;
    }
}
}

这样执行后出现了下面这些问题

请问这样是因为什么呢？如何正确赋值呢？

Answer 1

你可以将使用mapSet的地方贴出来。
原因应该是该数据不仅在VueX中被watch，还在其它地方被watch了，引发循环问题。
在设置以及取出VueX的数据时，都可以将数据深度拷贝一份，即是说去掉Vue附加的get/set监听。