[新增] select 组件, 待完善

src/index.ts

@@ -39,6 +39,7 @@ import LayForm from './module/form/index'
 import LayBreadcrumb from './module/breadcrumb/index'
 import LayBreadcrumbItem from './module/breadcrumbItem/index'
 import LayField from './module/field/index'
+import LaySelect from './module/select/index'
 
 const components: Record<string, IDefineComponent> = {
   LayRadio,
@@ -76,7 +77,8 @@ const components: Record<string, IDefineComponent> = {
   LayBreadcrumb,
   LayBreadcrumbItem,
   LayAvatar,
-  LayField
+  LayField,
+  LaySelect
 }
 
 const install = (app: App, options?: InstallOptions): void => {
@@ -128,6 +130,7 @@ export {
   LayBreadcrumbItem,
   LayAvatar,
   LayField,
+  LaySelect,
   install,
 }
 

src/module/select/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 || 'LaySelect', Component)
+}
+
+export default Component as IDefineComponent

src/module/select/index.vue

@@ -0,0 +1,44 @@
+<template>
+  <select name="city" lay-verify="required">
+    <option value=""></option>
+    <option value="0">北京</option>
+    <option value="1">上海</option>
+    <option value="2">广州</option>
+    <option value="3">深圳</option>
+    <option value="4">杭州</option>
+  </select>
+  <div class="layui-unselect layui-form-select" @click="open" :class="[openState?'layui-form-selected':'']">
+    <div class="layui-select-title">
+      <input
+        type="text"
+        placeholder="请选择"
+        value=""
+        readonly=""
+        class="layui-input layui-unselect"
+      /><i class="layui-edge"></i>
+    </div>
+    <dl class="layui-anim layui-anim-upbit" style="">
+      <dd lay-value="" class="layui-select-tips">请选择</dd>
+      <dd lay-value="0" class="layui-this">北京</dd>
+      <dd lay-value="1" class="">上海</dd>
+      <dd lay-value="2" class="">广州</dd>
+      <dd lay-value="3" class="">深圳</dd>
+      <dd lay-value="4" class="">杭州</dd>
+    </dl>
+  </div>
+</template>
+
+<script setup name="LaySelect" lang="ts">
+import { defineProps, ref } from 'vue'
+
+const props =
+  defineProps<{
+    modelValue?: string
+  }>()
+
+const openState = ref(false)
+
+const open = function() {
+    openState.value = !openState.value
+}
+</script>