Vue.js print raw html and call component methods

问题

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".

回答1:

That content will not be compiled as mentioned in official docs :

The contents of the span will be replaced with the value of the rawHtml property, interpreted as plain HTML - data bindings are ignored. Note that you cannot use v-html to compose template partials, because Vue is not a string-based templating engine. Instead, components are preferred as the fundamental unit for UI reuse and composition.

回答2:

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.

来源：https://stackoverflow.com/questions/54090325/vue-js-print-raw-html-and-call-component-methods