将HTML文件中的HTML加载到Vue div中

时间:2017-09-15 15:48:58

标签: javascript jquery vue.js vuejs2

所以,我使用jsfiddle跟随THIS     {{respondedText}}



<div>{{respondedText}}</div>
&#13;
&#13;
&#13;

然而,假设我想从文件或网站读取HTML内容,然后将其加载到该div中;而不是显示&#34;收到的事件:事件2&#34;。

对于我来说,这是我尝试使用它的最终结果。我希望,通过成功地使这个例子起作用,我可以构建一个webapp,它具有按钮,onpress,将从我服务器上的另一个本地文件加载html而无需重新加载整个页面。

1 个答案:

答案 0 :(得分:2)

要使用活动HTML填充元素,您必须使用v-html指令

<div v-html="respondedTest"></div>

这将允许任何有效的HTML,但您必须注意,您不能以这种方式异步加载Vue组件;它仅适用于静态HTML。

以下是您的JSFiddle已更新,可通过点击事件发送一些HTML。

编辑:

调查您的问题的精神,您可能需要查看vue-router这是一个非常好的系统,允许您使用类似于标准页面路由系统的路由系统的单页面应用程序。它还允许您在页面中安装Vue组件而不是静态HTML。