Vue.js print raw html and call component methods

ghz 1years ago ⋅ 7414 views

Question

I am dynamically loading the html content from an ajax request. This html has some buttons like

<button @click="someComponentMethod">Add</button>

As you can see I am trying to call components methods. But Its not working.

I think instead of @click html's default attribute "onclick" should work. But this will only recognize the function that are defined in global scope. Can someone guide me how I can call component's function from core javascript i.e using "onclick".

Update

Ok! I got it that v-html will not compile that html. But can you guys tell me how can I call component method from javascript (i.e outside of component scope). In this way I will be able to use onclick="JAVASCRIPT_CODE_TO_EXECUTE_METHOD".


Answer

Instead of loading html I end up saving component in JSON format. This component has a template property that stores the html string. In this way I am able to store and load component to and from database and it works without any issue.