Potential Offset Issue about vue-simple-context-menu

[johndatserakis]

Hi there @nickmarkfurness, hmm I see what you're saying. Yea it seems like in some cases, on certain layers, like modals or other overlays, there is an issue with the positioning. Issue #8 also has a bit of discussion around this.

I like the idea of allowing the ability to optionally attach to an element. I'll take a stab at getting that done as soon as I have some time coming up. Thank you.

[nickmarkfurness]

My work around is to get the div and append to the body tag on the on mounted() event. This seems to work fine for me so far ...
The mouse co-ords work on the view port of the page so maybe this is done no matter what??
I have yet to check if moving it stops Vue from any potential cleanup issue and if i need to do this on the beforeDestroy() event

[rttmax]

For me the problem was caused by css-transformed parent-elements.
I'm creating the menus dynamically when they are needed and append the markup directly to the body to get over this.

   handleContextMenu(e, i) {
      const ComponentClass = Vue.extend(VueSimpleContextMenu)
      const instance = new ComponentClass({
        store: this.$store,
        propsData: {
          ref: 'contextMenu',
          elementId: 'contextMenu',
          options: [
            {
              name: 'use',
              slug: 'use'
            }, ...
          ]
        }
      })
      instance.$on('menu-closed', () => {
        instance.$destroy()
        instance.$el.parentNode.removeChild(instance.$el)
      })
      instance.$mount()
      document.body.appendChild(instance.$el)
      instance.showMenu(e, i)
    }

Because I need to delete and destroy the component after use I added the 'menu-closed'-event.

[johndatserakis]

Closing for now, will open again if needed.