Question

我正在尝试在vuejs中嵌套两个组件。我只是不想跳到cli或webpack。所以我想做到这一点而无需导入/导出。从浏览器的控制台中，我得到警告：

[Vue警告]：编译模板时出错：

组件模板应仅包含一个根元素。如果要在多个元素上使用v-if，请改为使用v-else-if链接它们。

1 |

这是组件A

| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^

位于

--->

在此处尝试回答类似的问题。 VueJS nested components

但是它似乎是vuejs的旧版本。我不能那样做。

index.html：

tinymce.EditorManager.activeEditor.editorId;

app.js：

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="vue.js"></script>
    <meta charset="utf-8" />
</head>
<body>
    <div id="app">
        <component-a>
        </component-a>
    </div>
    <script src="app.js"></script>
</body>
</html>

期望组件b的模板出现在补码a的模板内。

Answer 1

在组件模板中，您必须只有一个HTML元素。您可以将元素包装在div中。

var ComponentA = {
template: '<div><p>This is the Component A</p><component-b></component-b></div>',
components: {
    'component-b': ComponentB
}

组件入门，尝试嵌套它们

1 个答案: