Getting Error in mounted hook: “RangeError: Maximum call stack size exceeded” in VUE js

问题

I am new to VUEJS and have little knowledge of state and mutations. I have a state which has a property called OSDViewer. This property of state is not being used anywhere else in app. My state looks like following.

const state = {
    OSDviewer: null,
}

In my mutations i am trying to set this OSDViwer to an openseadragon object in following way.

setupOsdCanvas: (state, payload) => {
        var OSDviewer = new openseadragon.Viewer({
            id: payload,
            showNavigationControl: false,
            showNavigator: true,
            navigatorId: 'navigator',
            maxZoomPixelRatio: 2
        })
        state.OSDviewer = OSDviewer;
        state.OSDviewer.addHandler('canvas-key', e => {
            if (e.originalEvent.code === 'KeyR' || e.originalEvent.code === 'KeyF') {
                e.preventDefaultAction = true
            }
        })
    },

but i am getting following error