johndatserakis/vue-simple-context-menu

"TypeError: this.$refs.vueSimpleContextMenu.showMenu is not a function"

sushovan0 opened this issue · 6 comments

[Vue warn]: Error in v-on handler: "TypeError: this.$refs.vueSimpleContextMenu.showMenu is not a function".

This happens to my application. I have just followed your installations instruction steps. But I have noticed in your example source code that it is totally different from your installation usage code example.
You have also used the "vue-click-outside" package but it is not mentioned anywhere in your installation and usage guide.
Please help me to get a solution.

Hey there, sorry you're having trouble using the library - I'd like to help you get this sorted out.

I'd just like to start by saying I'm a little bit confused when you bring up the v-click-outside package - this package is a dependency of the project, and is not something you'll need to actually interact with at all if you're importing vue-simple-context-menu correctly into your app. When you run npm i vue-simple-context-menu in your app, it will download vue-simple-context-menu and all its dependencies, which includes v-click-outside in this case.

I would look in the ./example folder for what would be the basic usage of the component. I fear you may be looking into the ./src folder - but that is where the actual source files are, and are not to be imported from directly. When using npm handle your packages, as I assume you are doing, it knows to look into the ./dist folder to get the actual built files.

There is one other point to bring up - you may be using view-simple-context-menu outside of a package manager use-case. In this case, you just need to tweak the setup a tiny bit, and you'll be all set. Please see this codepen I just setup, which shows a basic install and usage. Just right click on any of the names and you'll see the menu. In this example, the package is imported at the global level, and I show you how to use it in this environment.

I'm totally down to help further - so maybe you can provide the code where you try and do the installation, and I'll take a look.

Thank you.

Thank you. I have followed your "codepen" link and it works fine into my application.

Awesome, glad to hear it.

Code pen example doesnt seem to work?

oh i see this error occurs when u don't instantiate the VueSimpleContextMenu component properly it seems

Code pen example doesnt seem to work?

replace 'elementId' with 'element-id', Code pen example should work