[新增] collapse 组件
This commit is contained in:
parent
454b527541
commit
cccd93a076
@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<lay-collapse>
|
<lay-collapse>
|
||||||
<lay-collapse-item title="标题"> 内容 </lay-collapse-item>
|
<lay-collapse-item title="标题" show> 内容 </lay-collapse-item>
|
||||||
<lay-collapse-item title="标题"> 内容 </lay-collapse-item>
|
<lay-collapse-item title="标题"> 内容 </lay-collapse-item>
|
||||||
<lay-collapse-item title="标题"> 内容 </lay-collapse-item>
|
<lay-collapse-item title="标题"> 内容 </lay-collapse-item>
|
||||||
</lay-collapse>
|
</lay-collapse>
|
||||||
|
@ -5,13 +5,4 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="LayCollapse" lang="ts">
|
<script setup name="LayCollapse" lang="ts">
|
||||||
import { provide } from "vue";
|
|
||||||
|
|
||||||
const props =
|
|
||||||
defineProps<{
|
|
||||||
openKeys?:Array<string>
|
|
||||||
}>()
|
|
||||||
|
|
||||||
provide('openKeys',props.openKeys);
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
@ -1,9 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="layui-colla-item">
|
<div class="layui-colla-item">
|
||||||
<h2 class="layui-colla-title">
|
<h2 class="layui-colla-title" @click="showHandle">
|
||||||
{{ title }}<i class="layui-icon layui-colla-icon"></i>
|
{{ title }}<i class="layui-icon layui-colla-icon"></i>
|
||||||
</h2>
|
</h2>
|
||||||
<div class="layui-colla-content layui-show">
|
<div class="layui-colla-content" :class="isShow ? 'layui-show':''">
|
||||||
<p>
|
<p>
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</p>
|
</p>
|
||||||
@ -12,14 +12,19 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="LayCollapseItem" lang="ts">
|
<script setup name="LayCollapseItem" lang="ts">
|
||||||
import { defineProps, inject, ref } from 'vue'
|
import { defineProps, Ref, ref } from 'vue'
|
||||||
|
|
||||||
const props =
|
const props =
|
||||||
defineProps<{
|
defineProps<{
|
||||||
key?: string
|
show?: boolean
|
||||||
title?: string
|
title?: string
|
||||||
}>()
|
}>()
|
||||||
|
|
||||||
const openKeys = inject('openKeys');
|
const isShow = ref(props.show) as Ref
|
||||||
|
|
||||||
|
const showHandle = function() {
|
||||||
|
isShow.value = !isShow.value
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user