✨(component): [dropdown] dropdown-menu-item 新增 disabled 属性

package/component/src/component/carouselItem/index.vue

@@ -45,15 +45,18 @@ const getStyle = computed<any>(() => {
     if (activeIndex === currentIndex) {
       if (animation === "updown") {
         return {
-          transform: "translateY(0)", visibility: 'inherit'
+          transform: "translateY(0)",
+          visibility: "inherit",
         };
       } else if (animation.includes("fade")) {
         return {
-          opacity: 1,visibility: 'inherit'
+          opacity: 1,
+          visibility: "inherit",
         };
       } else {
         return {
-          transform: "translateX(0)",visibility: 'inherit'
+          transform: "translateX(0)",
+          visibility: "inherit",
         };
       }
     }

package/component/src/component/dropdown/index.vue

@@ -86,8 +86,8 @@ const openState = ref(false);
 
 const containerRef = computed(() =>
   props.popupContainer
-    // @ts-ignore
-    ? document.querySelector<HTMLElement>(props.popupContainer) ?? document.body
+    ? // @ts-ignore
+      document.querySelector<HTMLElement>(props.popupContainer) ?? document.body
     : dropdownRef.value
 ) as ComputedRef<HTMLElement>;
 
@@ -455,7 +455,7 @@ const handleMouseEnter = (e: MouseEvent) => {
 };
 
 const handleMouseEnterWithContext = (e: MouseEvent) => {
-  if (!props.popupContainer){
+  if (!props.popupContainer) {
     return;
   }
   dropdownCtx?.onMouseenter(e);

package/component/src/component/dropdownMenuItem/index.vue

@@ -7,9 +7,20 @@ export default {
 <script setup lang="ts">
 import { inject, Ref } from "vue";
 
+export interface LayDropdownMenuItemProps {
+  disabled?: boolean;
+}
+
+const props = withDefaults(defineProps<LayDropdownMenuItemProps>(), {
+  disabled: false,
+});
+
 const openState: Ref<boolean> = inject("openState") as Ref<boolean>;
 
 const handleClick = () => {
+  if (props.disabled) {
+    return;
+  }
   openState.value = false;
 };
 </script>
@@ -17,6 +28,7 @@ const handleClick = () => {
 <template>
   <li
     @click="handleClick"
+    :class="{ 'layui-disabled': disabled }"
     :style="$slots.suffix ? `justify-content: space-between;` : ''"
   >
     <span class="layui-menu-body-title">

package/component/src/component/dropdownSubMenu/index.vue

@@ -14,14 +14,14 @@ import { DropdownPlacement } from "../dropdown/interface";
 
 export type DropdownTrigger = "click" | "hover" | "focus" | "contextMenu";
 
-export interface LayDropdownProps {
+export interface LayDropdownSubMenuProps {
   trigger?: DropdownTrigger | DropdownTrigger[];
   placement?: DropdownPlacement;
   disabled?: boolean;
   contentOffset?: number;
 }
 
-const props = withDefaults(defineProps<LayDropdownProps>(), {
+const props = withDefaults(defineProps<LayDropdownSubMenuProps>(), {
   trigger: "hover",
   disabled: false,
   placement: "right-top",
@@ -37,7 +37,7 @@ const props = withDefaults(defineProps<LayDropdownProps>(), {
     :contentOffset="contentOffset"
     :disabled="disabled"
   >
-    <lay-dropdown-menu-item>
+    <lay-dropdown-menu-item :disabled="disabled">
       <template v-if="$slots.prefix" #prefix>
         <slot name="prefix" />
       </template>

package/document-component/src/document/zh-CN/components/dropdown.md

@@ -383,7 +383,7 @@ export default {
             <template #suffix><span style="font-size:10px">Ctrl + R</span></template>
           </lay-dropdown-menu-item>
           <lay-line></lay-line>
-          <lay-dropdown-menu-item>
+          <lay-dropdown-menu-item disabled>
             <template #prefix><lay-icon type="layui-icon-about"></lay-icon></template>
             <template #default>更多</template>
             <template #suffix><lay-icon type="layui-icon-right"></lay-icon></template>
@@ -425,7 +425,7 @@ export default {
             <template #prefix><lay-icon type="layui-icon-set-sm"></lay-icon></template>
             <template #default>选项二</template>
             <template #content>
-              <lay-dropdown-menu-item>子菜单一</lay-dropdown-menu-item>
+              <lay-dropdown-menu-item disabled>子菜单一</lay-dropdown-menu-item>
               <lay-dropdown-menu-item>子菜单二</lay-dropdown-menu-item>
               <lay-dropdown-sub-menu>
                 <template #default>子菜单三</template>
@@ -435,6 +435,14 @@ export default {
                    <lay-dropdown-menu-item>菜单3</lay-dropdown-menu-item>
                 </template>
               </lay-dropdown-sub-menu>
+              <lay-dropdown-sub-menu disabled>
+                <template #default>子菜单四</template>
+                <template #content>
+                   <lay-dropdown-menu-item>菜单1</lay-dropdown-menu-item>
+                   <lay-dropdown-menu-item>菜单2</lay-dropdown-menu-item>
+                   <lay-dropdown-menu-item>菜单3</lay-dropdown-menu-item>
+                </template>
+              </lay-dropdown-sub-menu>
             </template>
           </lay-dropdown-sub-menu>
           <lay-dropdown-menu-item>

package/document-component/src/document/zh-CN/guide/changelog.md

@@ -16,6 +16,7 @@
       <li> 
         <h3>1.2.7 <span class="layui-badge-rim">2022-07-04</span></h3> 
         <ul>
+          <li>[新增] dropdown-menu-item 新增 disabled 属性。by @starsatdawn</li>
           <li>[修复] table默认加载时有横向滚动条，header 的滚动条占位无法显示 by @dingyongya</li>
           <li>[优化] carousel首次加载时不应存在动画效果，而是应立即显示默认的item by @0o张不歪o0</li>
         </ul>