我正在使用 Vue.js 为我的 html5 游戏构建 ui。我有一个案例,我想定义 ui 容器,它基本上只是将其他 ui 组件分组并将它们定位到屏幕上的某个位置。所以我可以有这样的事情发生:
<ui-container>
<ui-component1></ui-component1>
<ui-component2></ui-component2>
<ui-component3></ui-component3>
</ui-container>
我需要根据代表容器内容的数据模型动态添加和删除这些组件。问题是我想保持 ui-container 通用,以便我可以将任何 Vue 组件附加到它,而无需在模板中提供有关可能存在哪些组件的信息。
我搜索了一下,发现这个例子涉及动态注入组件:http: //forum.vuejs.org/topic/349/injecting-components-to-the-dom 虽然示例中的数据驱动版本很容易制作和理解,它使用 v-for 作为标签,因此需要事先知道子组件的类型。
所以问题是,我如何概括该示例以动态使用任何组件?我的数据模型是否应该具有组件的类型或标签名称,然后在 v-for 中插入它?还是有这种要求的现有机制?