🐛(select and tab): 修复插槽解析逻辑 (优化速度)

This commit is contained in:
就眠儀式 2022-11-03 15:57:01 +08:00
parent 21d8d05032
commit e8078f76b1
3 changed files with 17 additions and 21 deletions

View File

@ -71,20 +71,18 @@ const options = ref<any>([]);
var timer: any;
const getOption = (nodes: VNode[], newOptions: any[]) => {
const showNodes = nodes?.filter((item: VNode) => {
return item.children != "v-if";
});
showNodes?.map((item: VNode) => {
nodes?.map((item) => {
let component = item.type as Component;
if (component.name === LaySelectOption.name) {
if (item.children) {
// @ts-ignore
item.props.label = item.children.default()[0].children;
}
newOptions.push(item.props);
} else {
if(item.type.toString() == "Symbol(Fragment)") {
getOption(item.children as VNode[], newOptions);
} else {
if (component.name == LaySelectOption.name) {
if (item.children) {
// @ts-ignore
item.props.label = item.children.default()[0].children;
}
newOptions.push(item.props);
}
}
});
};

View File

@ -25,7 +25,7 @@ import {
reactive,
h,
createTextVNode,
Fragment,
Fragment
} from "vue";
import { useResizeObserver } from "@vueuse/core";
import { TabData, TabInjectKey, TabPosition } from "./interface";
@ -45,15 +45,14 @@ const childrens: Ref<VNode[]> = ref([]);
const tabMap = reactive(new Map<number, TabData>());
const setItemInstanceBySlot = function (nodes: VNode[]) {
const showNodes = nodes?.filter((item: VNode) => {
return item.children != "v-if";
});
showNodes?.map((item) => {
nodes?.map((item) => {
let component = item.type as Component;
if (component.name != tabItem.name) {
if(item.type.toString() == "Symbol(Fragment)") {
setItemInstanceBySlot(item.children as VNode[]);
} else {
childrens.value.push(item);
if (component.name == tabItem.name) {
childrens.value.push(item);
}
}
});
};

View File

@ -14,8 +14,7 @@
<template>
<lay-tab v-model="current1">
<lay-tab-item title="选项一" id="1"><div style="padding:20px">选项一</div></lay-tab-item>
<!-- 注释 -->
<lay-tab-item title="选项一" v-if="true" id="1"><div style="padding:20px">选项一</div></lay-tab-item>
<lay-tab-item title="选项二" id="2"><div style="padding:20px">选项二</div></lay-tab-item>
</lay-tab>
</template>