[新增] dropdown 组件 trigger 属性，支持 hover click 触发方式

src/css/layui.css

@@ -4225,8 +4225,6 @@ body .layui-table-tips .layui-layer-content {
 
 .layui-menu li {
 	position: relative;
-	margin: 1px 0;
-	width: calc(100% + 1px);
 	line-height: 26px;
 	color: rgba(0, 0, 0, .8);
 	font-size: 14px;

src/index.ts

@@ -45,6 +45,7 @@ import LayEmpty from './module/empty/index'
 import LayFormItem from './module/formItem/index'
 import LayRate from './module/rate/index'
 import LayDropdown from './module/dropdown/index'
+import LayDropdownItem from './module/dropdownItem/index'
 import LayTab from './module/tab/index'
 import LayTabItem from './module/tabItem/index'
 
@@ -92,6 +93,7 @@ const components: Record<string, IDefineComponent> = {
   LayFormItem,
   LayRate,
   LayDropdown,
+  LayDropdownItem,
   LayTab,
   LayTabItem
 }
@@ -152,6 +154,7 @@ export {
   LayFormItem,
   LayRate,
   LayDropdown,
+  LayDropdownItem,
   LayTab,
   LayTabItem,
   install,

src/module/dropdown/index.vue

@@ -1,8 +1,29 @@
 <template>
-  <div class="layui-dropdown" @click="open" :class="[openState?'layui-dropdown-up':'']">
+  <div
+    v-if="trigger === 'click'"
+    class="layui-dropdown"
+    @click="open"
+    :class="[openState ? 'layui-dropdown-up' : '']"
+  >
     <slot></slot>
     <dl class="layui-anim layui-anim-upbit">
-      <slot name="content"></slot>
+      <ul class="layui-menu layui-dropdown-menu">
+        <slot name="content"></slot>
+      </ul>
+    </dl>
+  </div>
+  <div
+    v-if="trigger === 'hover'"
+    class="layui-dropdown"
+    @mouseenter="open"
+    @mouseleave="open"
+    :class="[openState ? 'layui-dropdown-up' : '']"
+  >
+    <slot></slot>
+    <dl class="layui-anim layui-anim-upbit">
+      <ul class="layui-menu layui-dropdown-menu">
+        <slot name="content"></slot>
+      </ul>
     </dl>
   </div>
 </template>
@@ -10,14 +31,18 @@
 <script setup name="LaySelect" lang="ts">
 import { defineProps, ref } from 'vue'
 
-const props =
+const props = withDefaults(
   defineProps<{
     trigger?: string
-  }>()
+  }>(),
+  {
+    trigger: 'click',
+  }
+)
 
 const openState = ref(false)
 
-const open = function() {
-    openState.value = !openState.value
+const open = function () {
+  openState.value = !openState.value
 }
 </script>

src/module/dropdownItem/index.ts

@@ -0,0 +1,9 @@
+import type { App } from 'vue'
+import Component from './index.vue'
+import type { IDefineComponent } from '../type/index'
+
+Component.install = (app: App) => {
+  app.component(Component.name || 'LayDropdownItem', Component)
+}
+
+export default Component as IDefineComponent

src/module/dropdownItem/index.vue

@@ -0,0 +1,8 @@
+<template>
+    <li><div class="layui-menu-body-title">
+        <slot></slot>
+    </div></li>
+</template>
+
+<script setup name="LayDropdownItem" lang="ts">
+</script>