🐛(tab/select): 修复 slots 打包后解析逻辑不正确的问题
This commit is contained in:
		
							parent
							
								
									3cf3ed0fc6
								
							
						
					
					
						commit
						beded0436f
					
				@ -1,6 +1,6 @@
 | 
			
		||||
{
 | 
			
		||||
  "name": "@layui/layui-vue",
 | 
			
		||||
  "version": "1.7.8",
 | 
			
		||||
  "version": "1.7.9-alpha.2",
 | 
			
		||||
  "author": "就眠儀式",
 | 
			
		||||
  "license": "MIT",
 | 
			
		||||
  "description": "a component library for Vue 3 base on layui-vue",
 | 
			
		||||
 | 
			
		||||
@ -18,6 +18,7 @@ import {
 | 
			
		||||
  watch,
 | 
			
		||||
  onUnmounted,
 | 
			
		||||
  StyleValue,
 | 
			
		||||
Fragment,
 | 
			
		||||
} from "vue";
 | 
			
		||||
import { LayIcon } from "@layui/icons-vue";
 | 
			
		||||
import LayInput from "../input/index.vue";
 | 
			
		||||
@ -25,6 +26,7 @@ import LayTagInput from "../tagInput/index.vue";
 | 
			
		||||
import LayDropdown from "../dropdown/index.vue";
 | 
			
		||||
import LaySelectOption, { SelectOptionProps } from "../selectOption/index.vue";
 | 
			
		||||
import { SelectSize } from "./interface";
 | 
			
		||||
import { ShapeFlags } from "../dropdown/util";
 | 
			
		||||
 | 
			
		||||
export interface SelectProps {
 | 
			
		||||
  name?: string;
 | 
			
		||||
@ -74,11 +76,10 @@ var timer: any;
 | 
			
		||||
 | 
			
		||||
const getOption = (nodes: VNode[], newOptions: any[]) => {
 | 
			
		||||
  nodes?.map((item) => {
 | 
			
		||||
    let component = item.type as Component;
 | 
			
		||||
    if (item.type.toString() == "Symbol(Fragment)") {
 | 
			
		||||
    if (item && item.shapeFlag && item.shapeFlag == ShapeFlags.ARRAY_CHILDREN) {
 | 
			
		||||
      getOption(item.children as VNode[], newOptions);
 | 
			
		||||
    } else {
 | 
			
		||||
      if (component.name == LaySelectOption.name) {
 | 
			
		||||
      if ((item.type as Component).name == LaySelectOption.name) {
 | 
			
		||||
        if (item.children) {
 | 
			
		||||
          // @ts-ignore
 | 
			
		||||
          const label = item.children.default()[0].children;
 | 
			
		||||
 | 
			
		||||
@ -29,6 +29,7 @@ import {
 | 
			
		||||
} from "vue";
 | 
			
		||||
import { useResizeObserver } from "@vueuse/core";
 | 
			
		||||
import { TabData, TabInjectKey, TabPosition } from "./interface";
 | 
			
		||||
import { ShapeFlags } from "../dropdown/util";
 | 
			
		||||
 | 
			
		||||
export interface TabProps {
 | 
			
		||||
  type?: string;
 | 
			
		||||
@ -41,16 +42,15 @@ export interface TabProps {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const slot = useSlots();
 | 
			
		||||
const childrens: Ref<VNode[]> = ref([]);
 | 
			
		||||
const tabMap = reactive(new Map<number, TabData>());
 | 
			
		||||
const childrens: Ref<VNode[]> = ref([]);
 | 
			
		||||
 | 
			
		||||
const setItemInstanceBySlot = function (nodes: VNode[]) {
 | 
			
		||||
  nodes?.map((item) => {
 | 
			
		||||
    let component = item.type as Component;
 | 
			
		||||
    if (item.type.toString() == "Symbol(Fragment)") {
 | 
			
		||||
    if (item && item.shapeFlag && item.shapeFlag == ShapeFlags.ARRAY_CHILDREN) {
 | 
			
		||||
      setItemInstanceBySlot(item.children as VNode[]);
 | 
			
		||||
    } else {
 | 
			
		||||
      if (component.name == tabItem.name) {
 | 
			
		||||
      if ((item.type as Component).name == tabItem.name) {
 | 
			
		||||
        childrens.value.push(item);
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
@ -291,14 +291,10 @@ const renderTabTitle = (attrs: Record<string, unknown>) => {
 | 
			
		||||
 | 
			
		||||
useResizeObserver(navRef, update);
 | 
			
		||||
 | 
			
		||||
watch(
 | 
			
		||||
  tabMap,
 | 
			
		||||
  function () {
 | 
			
		||||
watch(tabMap, () => {
 | 
			
		||||
    childrens.value = [];
 | 
			
		||||
    setItemInstanceBySlot((slot.default && slot.default()) as VNode[]);
 | 
			
		||||
  },
 | 
			
		||||
  { immediate: true }
 | 
			
		||||
);
 | 
			
		||||
}, {immediate: true });
 | 
			
		||||
 | 
			
		||||
watch(
 | 
			
		||||
  () => [
 | 
			
		||||
 | 
			
		||||
@ -686,7 +686,7 @@ const toolbarStyle = (toolbarName: string) => {
 | 
			
		||||
  if (props.defaultToolbar instanceof Array) {
 | 
			
		||||
    return { order: props.defaultToolbar.indexOf(toolbarName) } as StyleValue;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
onBeforeUnmount(() => {
 | 
			
		||||
  window.onresize = null;
 | 
			
		||||
@ -702,9 +702,12 @@ onBeforeUnmount(() => {
 | 
			
		||||
          <slot name="toolbar"></slot>
 | 
			
		||||
        </div>
 | 
			
		||||
        <div v-if="defaultToolbar" class="layui-table-tool-self">
 | 
			
		||||
          
 | 
			
		||||
          <!-- 筛选 -->
 | 
			
		||||
          <lay-dropdown v-if="showToolbar('filter')" updateAtScroll :style="toolbarStyle('filter')">
 | 
			
		||||
          <lay-dropdown
 | 
			
		||||
            v-if="showToolbar('filter')"
 | 
			
		||||
            updateAtScroll
 | 
			
		||||
            :style="toolbarStyle('filter')"
 | 
			
		||||
          >
 | 
			
		||||
            <div class="layui-inline" title="筛选" lay-event>
 | 
			
		||||
              <i class="layui-icon layui-icon-slider"></i>
 | 
			
		||||
            </div>
 | 
			
		||||
@ -746,7 +749,6 @@ onBeforeUnmount(() => {
 | 
			
		||||
          >
 | 
			
		||||
            <i class="layui-icon layui-icon-print"></i>
 | 
			
		||||
          </div>
 | 
			
		||||
 | 
			
		||||
        </div>
 | 
			
		||||
      </div>
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user