Programmatic open the context menu.

[liudonghua123]

I want to open a dynamic context menu programmatic in the right click event handler of a button or component. How can I achieve this?

[miyoosan]

well, you can do it with ref's method. first, use vue-menu anywhere like this: <hsc-menu-style-white> <hsc-menu-context-menu ref="contextmenu"> <div class="box" style="display: none;"></div> <template slot="contextmenu"> <hsc-menu-item label="MenuItem 1" /> <hsc-menu-item label="MenuItem 2" /> <hsc-menu-item label="MenuItem 2"> <hsc-menu-item label="MenuItem 4" /> <hsc-menu-item label="MenuItem 5" /> </hsc-menu-item> </template> </hsc-menu-context-menu> <hsc-menu-style-white> second, you can use method[open] to open contextmenu, and then use mouse event to set contextmenu's position like this: <div @click="click"><div/> .... methods: { click(e) { const menu = this.$refs.contextmenu.$refs.menu; menu.open(); menu.setPosition(e.pageX, e.pageY, 'right'); } }

[miyoosan]

I want to open a dynamic context menu programmatic in the right click event handler of a button or component. How can I achieve this?

more possible ways, you can try out the vue-menu instance

[liudonghua123]

@miyoosan Thanks, I will try your solution. 😄