Vue.js 打印原始 html 并调用组件方法 [英] Vue.js print raw html and call component methods

问题描述

我正在从 ajax 请求动态加载 html 内容.这个 html 有一些按钮，比如

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.

我认为应该使用onclick"而不是@click html 的默认属性.但这只会识别在全局范围内定义的函数.有人可以指导我如何从核心 javascript 调用组件的函数，即使用onclick".

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

更新

好的！我知道 v-html 不会编译那个 html.但是你们能告诉我如何从 javascript 调用组件方法(即组件范围之外).这样我就可以使用 onclick="JAVASCRIPT_CODE_TO_EXECUTE_METHOD".

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

推荐答案

我最终将组件保存为 JSON 格式，而不是加载 html.该组件有一个模板属性，用于存储 html 字符串.通过这种方式，我可以在数据库中存储和加载组件，并且它可以正常工作.

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.

这篇关于Vue.js 打印原始 html 并调用组件方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！