docs: 优化文档

This commit is contained in:
就眠仪式 2021-10-26 01:14:17 +08:00
parent 8d99918e56
commit 401efd527d
32 changed files with 165 additions and 160 deletions

View File

@ -50,6 +50,6 @@ export default {
::: title Block 属性
:::
| Name | Description | Accepted Values |
| ----- | ------ | -------------- |
| nm | 灰色样式 | -- |
| Name | Description | Accepted Values |
| ---- | ----------- | --------------- |
| nm | 灰色样式 | -- |

View File

@ -1,5 +1,5 @@
::: title 基础使用
:::
:::
::: demo
@ -26,7 +26,7 @@ export default {
:::
::: title 指定分割
:::
:::
::: demo
@ -79,13 +79,13 @@ export default {
::: title 面包屑属性
:::
| Name | Description | Accepted Values |
| --------- | ------ | --- |
| separator | 分割符 | `/` |
| Name | Description | Accepted Values |
| --------- | ----------- | --------------- |
| separator | 分割符 | `/` |
::: title 面包屑插槽
:::
| Name | Description | Accepted Values |
| --------- | ------ | --- |
| default | 默认插槽 | `--` |
| Name | Description | Accepted Values |
| ------- | ----------- | --------------- |
| default | 默认插槽 | `--` |

View File

@ -57,7 +57,7 @@ export default {
::: title 按钮尺寸
:::
::: demo 传入 size 属性, 创建指定尺寸的按钮, 可选值 `lg` `sm` `xs`
::: demo 传入 size 属性, 创建指定尺寸的按钮, 可选值 `lg` `sm` `xs`
<template>
<lay-button type="primary" size="lg">原始按钮</lay-button>
@ -226,7 +226,7 @@ export default {
::: title 加载按钮
:::
::: demo 传入 loading 属性, 控制按钮的加载状态
::: demo 传入 loading 属性, 控制按钮的加载状态
<template>
<lay-button-container>
@ -255,10 +255,10 @@ export default {
::: title 按钮属性
:::
| Name | Description | Accepted Values |
| ------ | ------ | --------------------------------------------- |
| type | 主题 | `primary` `normal` `warm` `danger` `disabled` |
| size | 尺寸 | `lg` `sm` `xs` |
| fluid | 最大化 | `true` `false` |
| radius | 圆角 | `true` `false` |
| border | 边框 | `green` `blue` `orange` `red` `black` |
| Name | Description | Accepted Values |
| ------ | ----------- | --------------------------------------------- |
| type | 主题 | `primary` `normal` `warm` `danger` `disabled` |
| size | 尺寸 | `lg` `sm` `xs` |
| fluid | 最大化 | `true` `false` |
| radius | 圆角 | `true` `false` |
| border | 边框 | `green` `blue` `orange` `red` `black` |

View File

@ -29,6 +29,7 @@ export default {
padding: 20px;
}
</style>
:::
::: title 卡片插槽
@ -67,6 +68,7 @@ export default {
padding: 20px;
}
</style>
:::
::: title 简单使用
@ -100,20 +102,20 @@ export default {
padding: 20px;
}
</style>
:::
:::
::: title 卡片属性
:::
| | | |
| ------ | ---- | ------ |
| title | 标题 | -- |
| | | |
| ----- | ---- | --- |
| title | 标题 | -- |
::: title 卡片插槽
:::
| | | |
| ------ | ---- | ------ |
| header | 头部插槽 | -- |
| body | 内容插槽 | -- |
| | | |
| ------ | -------- | --- |
| header | 头部插槽 | -- |
| body | 内容插槽 | -- |

View File

@ -28,20 +28,19 @@ export default {
:::
::: title Collapse attributes
:::
| Name | Description | Accepted Values |
| ----- | ------ | -------------- |
| openKeys | 打开的目录 | `array` |
| Name | Description | Accepted Values |
| -------- | ----------- | --------------- |
| openKeys | 打开的目录 | `array` |
::: title Collapse-item attributes
:::
| Name | Description | Accepted Values |
| ----- | ------ | -------------- |
| id | 编号 | -- |
| title | 标题 | -- |
| Name | Description | Accepted Values |
| ----- | ----------- | --------------- |
| id | 编号 | -- |
| title | 标题 | -- |

View File

@ -68,6 +68,6 @@ export default {
::: title 容器属性
:::
| Name | Description | Accepted Values |
| ----- | ------ | -------------- |
| fluid | 流模式 | `true` `false` |
| Name | Description | Accepted Values |
| ----- | ----------- | --------------- |
| fluid | 流模式 | `true` `false` |

View File

@ -70,14 +70,13 @@ export default {
::: title Dropdown 属性
:::
| Name | Description | Accepted Values |
| ------- | -------- | --------------- |
| trigger | 触发方式 | `click` `hover` |
| Name | Description | Accepted Values |
| ------- | ----------- | --------------- |
| trigger | 触发方式 | `click` `hover` |
::: title Dropdown 插槽
:::
| Name | Description | Accepted Values |
| ------- | -------- | --------------- |
| content | 下拉内容 | -- |
| Name | Description | Accepted Values |
| ------- | ----------- | --------------- |
| content | 下拉内容 | -- |

View File

@ -48,6 +48,6 @@ export default {
:::
| Name | Description | Accepted Values |
| ----------- | -------- | --- |
| description | 描述信息 | -- |
| Name | Description | Accepted Values |
| ----------- | ----------- | --------------- |
| description | 描述信息 | -- |

View File

@ -1,4 +1,3 @@
::: demo
<template>
@ -62,6 +61,6 @@ export default {
::: title field attributes
:::
| Name | Description | Accepted Values |
| ----- | ---- | --- |
| title | 标题 | -- |
| Name | Description | Accepted Values |
| ----- | ----------- | --------------- |
| title | 标题 | -- |

View File

@ -45,20 +45,20 @@ export default {
::: title 表单事件
:::
| Name | Description | Accepted Values |
| ----- | ------ | -------------- |
| model | 表单绑定值 | -- |
| Name | Description | Accepted Values |
| ----- | ----------- | --------------- |
| model | 表单绑定值 | -- |
::: title 表单事件
:::
| Name | Description | Accepted Values |
| ----- | ------ | -------------- |
| submit | 提交事件 | -- |
| Name | Description | Accepted Values |
| ------ | ----------- | --------------- |
| submit | 提交事件 | -- |
::: title 表单项属性
:::
| Name | Description | Accepted Values |
| ----- | ------ | -------------- |
| label | 标题名称 | -- |
| Name | Description | Accepted Values |
| ----- | ----------- | --------------- |
| label | 标题名称 | -- |

View File

@ -140,21 +140,21 @@ export default {
:::
| Name | Description | Accepted Values |
| -------- | ---- | ----------------------- |
| space | 间隔 | -- |
| Name | Description | Accepted Values |
| ----- | ----------- | --------------- |
| space | 间隔 | -- |
::: title 列属性
:::
| Name | Description | Description Info | Accepted Values |
| -------- | ---- | ----------------------- | --- |
| xs | 尺寸 | 超小屏幕 (手机<768px) | 12 |
| sm | 尺寸 | 小屏幕 (平板 ≥768px) | 12 |
| md | 尺寸 | 中等屏幕 (桌面 ≥992px) | 12 |
| lg | 尺寸 | 大型屏幕 (桌面 ≥1200px) | 12 |
| xsOffset | 偏移 | 超小屏幕 (手机<768px) | 12 |
| smOffset | 偏移 | 小屏幕 (平板 ≥768px) | 12 |
| mdOffset | 偏移 | 中等屏幕 (桌面 ≥992px) | 12 |
| lgOffset | 偏移 | 大型屏幕 (桌面 ≥1200px) | 12 |
| Name | Description | Description Info | Accepted Values |
| -------- | ----------- | ----------------------- | --------------- |
| xs | 尺寸 | 超小屏幕 (手机<768px) | 12 |
| sm | 尺寸 | 小屏幕 (平板 ≥768px) | 12 |
| md | 尺寸 | 中等屏幕 (桌面 ≥992px) | 12 |
| lg | 尺寸 | 大型屏幕 (桌面 ≥1200px) | 12 |
| xsOffset | 偏移 | 超小屏幕 (手机<768px) | 12 |
| smOffset | 偏移 | 小屏幕 (平板 ≥768px) | 12 |
| mdOffset | 偏移 | 中等屏幕 (桌面 ≥992px) | 12 |
| lgOffset | 偏移 | 大型屏幕 (桌面 ≥1200px) | 12 |

View File

@ -1107,9 +1107,9 @@ export default {
::: title 图标属性
:::
| Name | Description | Default Value |
| ---- | ---- | ----------------- |
| type | 图标 | `layui-icon-home` |
| prefix | 前缀 | `layui-icon` |
| color | 颜色 | -- |
| size | 尺寸 | -- |
| Name | Description | Default Value |
| ------ | ----------- | ----------------- |
| type | 图标 | `layui-icon-home` |
| prefix | 前缀 | `layui-icon` |
| color | 颜色 | -- |
| size | 尺寸 | -- |

View File

@ -35,6 +35,6 @@ export default {
:::
| Name | Description | Accepted Values |
| ----- | ---- | --------------------------------------------- |
| theme | 主题 | `orange` `green` `cyan` `blue` `black` `gray` |
| Name | Description | Accepted Values |
| ----- | ----------- | --------------------------------------------- |
| theme | 主题 | `orange` `green` `cyan` `blue` `black` `gray` |

View File

@ -80,14 +80,14 @@ export default {
::: title 菜单属性
:::
| Name | Description | Accepted Values |
| --------------------- | ------ | --- |
| selectedKey (v-model) | 选中项 | -- |
| openKeys (v-model) | 打开项 | -- |
| Name | Description | Accepted Values |
| --------------------- | ----------- | --------------- |
| selectedKey (v-model) | 选中项 | -- |
| openKeys (v-model) | 打开项 | -- |
::: title 菜单插槽
:::
| Name | Description | Accepted Values |
| ----- | -------- | --- |
| title | 菜单标题 | -- |
| Name | Description | Accepted Values |
| ----- | ----------- | --------------- |
| title | 菜单标题 | -- |

View File

@ -209,15 +209,14 @@ export default {
::: title 分页事件
:::
| | | |
| ----------- | ------------ | ------- |
| jump | 切换回调 | { current: 当前页面 } |
| | | |
| ---- | -------- | --------------------- |
| jump | 切换回调 | { current: 当前页面 } |
::: title 分页插槽
:::
| | | |
| ----------- | ------------ | ------- |
| prev | 上一页 | 上一页 |
| next | 下一页 | 下一页 |
| | | |
| ---- | ------ | ------ |
| prev | 上一页 | 上一页 |
| next | 下一页 | 下一页 |

View File

@ -24,6 +24,6 @@ export default {
::: title 面板插槽
:::
| Name | Description | Accepted Values |
| ----- | ------ | -------------- |
| default | 默认插槽 | -- |
| Name | Description | Accepted Values |
| ------- | ----------- | --------------- |
| default | 默认插槽 | -- |

View File

@ -81,4 +81,4 @@ export default {
| | | |
| ------- | -------- | --- |
| v-model | 评分值 | -- |
| length | 评分长度 | -- |
| length | 评分长度 | -- |

View File

@ -58,29 +58,29 @@ export default {
::: title select 属性
:::
| Name | Description | Accepted Values |
| -------- | ---- | ----------------------- |
| name | 原生 name 属性 | -- |
| v-model | 选中值 | -- |
| Name | Description | Accepted Values |
| ------- | -------------- | --------------- |
| name | 原生 name 属性 | -- |
| v-model | 选中值 | -- |
::: title select-option 属性
:::
| Name | Description | Accepted Values |
| -------- | ---- | ----------------------- |
| label | 标签 | -- |
| value | 值 | -- |
| Name | Description | Accepted Values |
| ----- | ----------- | --------------- |
| label | 标签 | -- |
| value | 值 | -- |
::: title select-option 插槽
:::
| Name | Description | Accepted Values |
| -------- | ---- | ----------------------- |
| default | 默认 | -- |
| Name | Description | Accepted Values |
| ------- | ----------- | --------------- |
| default | 默认 | -- |
::: title select 事件
:::
| Name | Description | Accepted Values |
| -------- | ---- | ----------------------- |
| change | 切换事件 | value |
| Name | Description | Accepted Values |
| ------ | ----------- | --------------- |
| change | 切换事件 | value |

View File

@ -116,6 +116,6 @@ export default {
| name | 原生 name 属性 | -- |
| v-model | 是否启用 | `true` `false` |
| disabled | 禁用 | `true` `false` |
| change | 切换事件 | current : 当前值 |
| change | 切换事件 | current : 当前值 |
| active-text | 启用描述 | `启动` |
| inactive-text | 禁用描述 | `禁用` |

View File

@ -1,5 +1,5 @@
::: title 基础使用
:::
:::
::: demo
@ -59,7 +59,7 @@ export default {
:::
::: title 不同尺寸
:::
:::
::: demo
@ -119,7 +119,7 @@ export default {
:::
::: title 开启分页
:::
:::
::: demo
@ -190,7 +190,7 @@ export default {
:::
::: title 完整表格
:::
:::
::: demo
@ -264,20 +264,20 @@ export default {
:::
| | | |
| --------------- | ---------- | --- |
| columns | 列配置 | -- |
| dataSource | 数据源 | -- |
| checkbox | 开启复现框 | -- |
| id | 主键 | -- |
| selectedKeys ( v-model ) | 选中项 | -- |
| default-toolbar | 开启工具栏 | `lg` `md` `sm` |
| size | 尺寸 | -- |
| | | |
| ------------------------ | ---------- | -------------- |
| columns | 列配置 | -- |
| dataSource | 数据源 | -- |
| checkbox | 开启复现框 | -- |
| id | 主键 | -- |
| selectedKeys ( v-model ) | 选中项 | -- |
| default-toolbar | 开启工具栏 | `lg` `md` `sm` |
| size | 尺寸 | -- |
::: title table slots
:::
| | | |
| --------------- | ----------- | --- |
| toolbar | 自定义工具栏 | -- |
| | | |
| ------- | ------------ | --- |
| toolbar | 自定义工具栏 | -- |

View File

@ -76,7 +76,7 @@ export default {
:::
| | | |
| --------------- | ---------- | --- |
| simple | 简单模式 | -- |
| title | 标题 | -- |
| | | |
| ------ | -------- | --- |
| simple | 简单模式 | -- |
| title | 标题 | -- |

View File

@ -86,15 +86,15 @@ export default {
::: title transfer 属性
:::
| Name | Description | Accepted Values |
| -------- | ---- | ----------------------- |
| dataSource | 数据来源 | -- |
| title | 标题 | -- |
| id | 主键 | -- |
| Name | Description | Accepted Values |
| ---------- | ----------- | --------------- |
| dataSource | 数据来源 | -- |
| title | 标题 | -- |
| id | 主键 | -- |
::: title transfer 插槽
:::
| Name | Description | Accepted Values |
| -------- | ---- | ----------------------- |
| item | 列表项 | { data } |
| Name | Description | Accepted Values |
| ---- | ----------- | --------------- |
| item | 列表项 | { data } |

View File

@ -14,4 +14,4 @@ layui - vue谐音类 UI) 是 一 套 Vue 3.0 的 桌 面 端 组 件 库 ,
<lay-timeline-item title="2017年layui 里程碑版本 2.0 发布" simple></lay-timeline-item>
<lay-timeline-item title="2016年layui 首个版本发布" simple></lay-timeline-item>
<lay-timeline-item title="2015年layui 孵化" simple></lay-timeline-item>
</lay-timeline>
</lay-timeline>

View File

@ -10,6 +10,6 @@ const dropdownRef = (ref < null) | (HTMLElement > null)
const isClickOutside = useClickOutside(dropdownRef)
watch(isClickOutside, () => {
// do something
// do something
})
```

View File

@ -28,4 +28,4 @@ export default function createContainer(
},
},
]
}
}

View File

@ -28,4 +28,4 @@ export default function createContainer(
},
},
]
}
}

View File

@ -30,4 +30,4 @@ export default function createContainer(
},
},
]
}
}

View File

@ -1,7 +1,7 @@
<template>
<lay-layout>
<lay-side>
<lay-scroll style="overflow-y: scroll;">
<lay-scroll style="overflow-y: scroll">
<ul class="layui-menu layui-menu-lg layui-menu-docs">
<li
v-for="menu in menus"

View File

@ -1,7 +1,7 @@
<template>
<lay-layout>
<lay-side>
<lay-scroll style="overflow-y: scroll;">
<lay-scroll style="overflow-y: scroll">
<ul class="layui-menu layui-menu-lg layui-menu-docs">
<li
v-for="menu in menus"
@ -85,7 +85,7 @@ export default {
title: '更新',
subTitle: 'change log',
path: '/zh-CN/guide/changelog',
}
},
],
},
]

View File

@ -1,7 +1,7 @@
<template>
<lay-layout>
<lay-side>
<lay-scroll style="overflow-y: scroll;">
<lay-scroll style="overflow-y: scroll">
<ul class="layui-menu layui-menu-lg layui-menu-docs">
<li
v-for="menu in menus"

View File

@ -1,5 +1,12 @@
<template>
<div style="margin-top:60px;background-color: whitesmoke; height: 100%; width: 100%">
<div
style="
margin-top: 60px;
background-color: whitesmoke;
height: 100%;
width: 100%;
"
>
<div class="site-banner">
<div class="site-banner-main">
<div class="site-zfj site-zfj-anim">

View File

@ -1,7 +1,7 @@
import { ref, onMounted, onUnmounted, Ref } from 'vue'
const useNestedEvent = (elementRef: Ref<HTMLElement | null>) => {
const event = ref(false)
return event
}
export default useNestedEvent
const event = ref(false)
return event
}
export default useNestedEvent