Vue.js VueJS未在jquery ajax加载上呈现组件

我有两个

HTML

文件，每当我点击

link-a

它就会触发

$( "#content" ).load( "nav-a.html" );

my base.html文件

<div id="content">
</div>

我的nav-a.html

<component-a> </component-a>

---

我的问题是组件a没有呈现，在jQueryAjax加载中可能吗？我在

.load

回调上尝试了vm.compile（）和vm.forceUpdate（），但什么也没发生。

没有，原因有几个：

您可能不应该让另一个脚本修改由VueJS控制的DOM元素。它很可能会在最后把事情弄糟。要执行http请求，可以使用。当然，它不会更新DOM（您应该将其映射到模板）；MVVM框架的整体思想是在视图中包含一个数据模型

但即使在这种情况下，也不能使用原始html注入直接呈现组件，正如v-html指令文档中所述：

内容作为普通HTML插入-忽略数据绑定。 请注意，您不能使用v-html来编写模板部分，因为 Vue不是基于字符串的模板引擎。相反，组件是 首选作为UI重用和组合的基本单元

资料来源：

---

因此，您可能想使用其中一种，或者更方便的（我真的建议您看看它们）。但无论如何，您可能需要更改应用程序的逻辑。

否，原因如下：

您可能不应该让另一个脚本修改由VueJS控制的DOM元素。它很可能会在最后把事情弄糟。要执行http请求，可以使用。当然，它不会更新DOM（您应该将其映射到模板）；MVVM框架的整体思想是在视图中包含一个数据模型

但即使在这种情况下，也不能使用原始html注入直接呈现组件，正如v-html指令文档中所述：

内容作为普通HTML插入-忽略数据绑定。 请注意，您不能使用v-html来编写模板部分，因为 Vue不是基于字符串的模板引擎。相反，组件是 首选作为UI重用和组合的基本单元

资料来源：

因此，您可能想使用其中一种，或者更方便的（我真的建议您看看它们）。但无论如何，你可能需要更改应用程序的逻辑。

我也有同样的问题。 正如Cobaltway所说，由于XSS，在视图中动态加载HTML内容是不安全的

但是。。如果您确定您的内容来源，您可以像我一样：

在我的loadPage（target）函数中，我总是删除我的vue实例并再次创建它

所以。。您可以这样创建vue：

let content_vue_set = {
    el: '#content',
    // And all your stuff here (data, methods, watchers, etc.)
};
let content_vue = new Vue(content_vue_set);

然后，每次在页面中加载某些内容时，只需执行以下操作：

content_vue.$destroy(); // To destroy the last Vue instance
$('#content').load(new_content); // Actually render the new content
content_vue = new Vue(content_vue_set); // Re-compile your vue instance

正如我所说。。这不是一个最佳的解决方案，所以您可能会使用另一种逻辑

希望这会有所帮助；-）

我也有同样的问题。 正如Cobaltway所说，由于XSS，在视图中动态加载HTML内容是不安全的

但是。。如果您确定您的内容来源，您可以像我一样：

在我的loadPage（target）函数中，我总是删除我的vue实例并再次创建它

所以。。您可以这样创建vue：

let content_vue_set = {
    el: '#content',
    // And all your stuff here (data, methods, watchers, etc.)
};
let content_vue = new Vue(content_vue_set);

然后，每次在页面中加载某些内容时，只需执行以下操作：

content_vue.$destroy(); // To destroy the last Vue instance
$('#content').load(new_content); // Actually render the new content
content_vue = new Vue(content_vue_set); // Re-compile your vue instance

正如我所说。。这不是一个最佳的解决方案，所以您可能会使用另一种逻辑

---

希望这会有所帮助；-）

不要使用Vue资源，因为它已不再维护。不要使用Vue资源，因为它已不再维护。