Vue.js Vuejs:由于'v-if'而未呈现插槽内容组件实例`

我想将选项卡和树视图进行递归组合。请看下面的简单示例，了解它的工作原理：

Vue.component（'tabs'{
模板：“#制表符”，
数据（）{
返回{
选项卡：[]，
对,，
};
},
安装的（）{
对于（i=0；i

{{tab.label}

胡特
知道
威特利
呜呜声
因此您需要将其展开，并在运行
装入后，将展开设置为其预期初始值：

Vue.component('tabs', {
  template: '#tabs',
  data() {
    return {
      tabs: [],
      defaultExpanded: false,
      expanded: true,
    };
  },
  mounted() {
    for (const tab of this.$slots.default) {
      if (tab.componentOptions && tab.componentOptions.tag == 'tab') {
        this.tabs.push(tab.componentInstance);
      }
    }
    this.expanded = this.defaultExpanded;
  }
});

是的，那可能有用。这会增加渲染所有dom元素的开销吗？还是vue会在完成之前将其全部保密？我认为它会在虚拟dom中完成所有工作，而不会进行任何真实的dom渲染。谢谢，我将勾选此项，并将下一个问题留到明天