61 lines
1.3 KiB
Vue
61 lines
1.3 KiB
Vue
|
<template>
|
||
|
<select :name="name" lay-verify="required"></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="name"
|
||
|
class="layui-input layui-unselect"
|
||
|
@input="change"
|
||
|
style="
|
||
|
background: rgba(255, 255, 255, 0.05);
|
||
|
border: none;
|
||
|
color: whitesmoke;
|
||
|
"
|
||
|
/><i class="layui-edge"></i>
|
||
|
</div>
|
||
|
<dl class="layui-anim layui-anim-upbit" style="">
|
||
|
<dd lay-value="" class="layui-select-tips">请选择</dd>
|
||
|
<dd
|
||
|
v-for="data in datas"
|
||
|
lay-value=""
|
||
|
@click="jump(data)"
|
||
|
:key="data"
|
||
|
class="layui-select-tips"
|
||
|
>
|
||
|
{{ data.title }}
|
||
|
</dd>
|
||
|
</dl>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script setup name="LaySelect" lang="ts">
|
||
|
import { defineProps, Ref, ref } from 'vue'
|
||
|
import { useRouter, useRoute } from 'vue-router'
|
||
|
|
||
|
const props =
|
||
|
defineProps<{
|
||
|
datas?: object[]
|
||
|
}>()
|
||
|
|
||
|
const route = useRoute()
|
||
|
const router = useRouter()
|
||
|
|
||
|
const openState = ref(false)
|
||
|
|
||
|
const name = ref('')
|
||
|
|
||
|
const open = function () {
|
||
|
openState.value = !openState.value
|
||
|
}
|
||
|
|
||
|
const jump = function (data: any) {
|
||
|
router.push(data.path)
|
||
|
name.value = data.title
|
||
|
}
|
||
|
</script>
|