This commit is contained in:
2022-12-09 16:41:41 +08:00
parent c1cce5a7c2
commit ff7aa8774f
2003 changed files with 156639 additions and 140 deletions

View File

@@ -0,0 +1,100 @@
::: anchor
:::
::: title 基本介绍
:::
::: describe 面板通常是指一个独立的容器
:::
::: title 基础使用
:::
::: demo 使用 `lay-panel` 标签, 创建面板。
<template>
<lay-panel>面板</lay-panel>
</template>
<script>
import { ref } from 'vue'
export default {
setup() {
return {
}
}
}
</script>
:::
::: title 边框阴影
:::
::: demo 通过 `shadow` 属性设置阴影出现的时机,可选值为 `always` `hover` `never` 默认为 `always`。
<template>
<div class="panel-container">
<lay-panel>
内容
</lay-panel>
<lay-panel shadow="hover">
内容
</lay-panel>
<lay-panel shadow="never">
内容
</lay-panel>
</div>
</template>
<script>
import { ref } from 'vue'
export default {
setup() {
return {
}
}
}
</script>
<style>
.panel-container > * {
background: whitesmoke;
margin-top: 20px;
}
</style>
:::
::: title Panel 属性
:::
::: table
| 插槽 | 描述 | 类型 | 默认值 | 可选值 |
| ------- | -------- | ------ | ------ | ----- |
| shadow | 阴影 | `string` | `always` | `always` `hover` `never` |
:::
::: title Panel 插槽
:::
::: table
| 插槽 | 描述 | 参数 |
| ------- | -------- | ------ |
| default | 默认插槽 | -- |
:::
::: contributor panel
:::
::: previousNext panel
:::