时间戳

首页 > 解决方案 > 如何让 vue 组件在任何地方渲染？

laravel - 如何让 vue 组件在任何地方渲染？

问题描述

我想知道如何使组件在任何地方渲染，而无需放入带有id="app".

id="app"当我制作另一个元素id="app"并将另一个 vue 组件放入其中时，我有 4 个组件和一个 div，其他组件停止工作。

标签： laravelvue.js

解决方案

您不会创建新的 HTML 元素（标签），id="app"因为：

  1. id是唯一的，你不能超过 1。
  2. 您必须id在网页的任何部分使用它或引用，但您必须知道与之相关的所有内容都vue必须进入其中。

因此，如果您的页面包含多个组件，则必须有一个父元素id="app"或您选择用作参考的任何内容。

例如：

<body id="app">
    <div>
        <vue-component-a />
        <vue-component-b />
        <vue-component-c />
        <vue-component-d />
    </div>
</body>

或者最常用的方式是：

<body>
    <div id="app">
        <vue-component-a />
        <vue-component-b />
        <vue-component-c />
        <vue-component-d />
    </div>
</body>

推荐阅读