Javascript Vue.js相当于appendChild以动态添加新元素/组件？

在Vue.js中，我有一个

var-app=new-Vue（{…}）我有一个组件
Vue.component（'mycomponent'，…
在这里，我可以通过在html中直接添加
来使用此类组件，而不会产生任何问题。我希望做的是在按钮单击后或其他类似事件发生时，根据需要动态添加这些组件。在原始JS中，我会在事件触发时使用
document.createElement…
，然后执行
e）l、 appendChild..
将其添加到html中。如何使用Vue.js执行相同操作

我没有对node js做任何花哨的事情。这是在一个html页面上，在
中使用
，要做到这一点，“Vue方式”通常包括使用，或者，取决于您想做什么：


使用
v-if
根据条件有条件地显示组件/元素
使用
v-for
呈现组件/元素列表
使用
渲染动态组件/元素

因此，为了实现您在问题中所描述的，您可以声明一个布尔数据属性
visible
，如下所示：

data（）{
返回{
可见：假
}
}

并将其与
v-if
一起使用，以控制组件在模板中的可见性：



这要求模板中预先存在
。如果不知道要显示哪种组件，则可以在模板中包含每种可能性，并根据某些条件显示所需的组件：



或者，您可以将
与另一个数据属性（
comp
）一起使用，您可以将该属性设置为要显示的组件的名称：



Vue中不存在您所描述的内容（
document.createElement
后跟
el.appendChild
）。Vue有一个您需要使用的严格的呈现机制；不可能动态实例化组件并将其随机粘贴到DOM中。从技术上讲，您可以执行
comp=new Vue（）
相当于
document.createElement
，然后是
el.appendChild（comp.$el）
，但这可能不是您想要做的，因为您将创建一个独立的Vue实例，您必须手动管理该实例，而无需轻松地传递数据