[组件] 初步集成 breadcrumb 面包屑

This commit is contained in:
就眠仪式
2021-09-30 14:56:36 +08:00
parent e412c41eb6
commit 7e2f6abc7b
10 changed files with 81 additions and 5 deletions

View File

@@ -34,6 +34,8 @@ import LayMenuItem from './module/menuItem/index'
import LayMenuChildItem from './module/menuChildItem/index'
import LayCheckbox from './module/checkbox/index'
import LayForm from './module/form/index'
import LayBreadcrumb from './module/breadcrumb/index'
import LayBreadcrumbItem from './module/breadcrumbItem/index'
const components: Record<string, IDefineComponent> = {
LayRadio,
@@ -66,7 +68,9 @@ const components: Record<string, IDefineComponent> = {
LayMenuItem,
LayMenuChildItem,
LayCheckbox,
LayForm
LayForm,
LayBreadcrumb,
LayBreadcrumbItem
}
const install = (app: App, options?: InstallOptions): void => {
@@ -111,6 +115,8 @@ export {
LayMenuChildItem,
LayCheckbox,
LayForm,
LayBreadcrumb,
LayBreadcrumbItem,
install,
}

View File

@@ -6,4 +6,4 @@ Component.install = (app: App) => {
app.component(Component.name || 'LayBody', Component)
}
export default Component as IDefineComponent
export default Component as IDefineComponent

View File

@@ -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 || 'LayBreadcrumb', Component)
}
export default Component as IDefineComponent

View File

@@ -0,0 +1,10 @@
<template>
<span class="layui-breadcrumb" style="visibility: visible;">
<slot></slot>
</span>
</template>
<script setup name="LayBreadcrumb" lang="ts">
import { useSlots } from "vue";
</script>

View File

@@ -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 || 'LayBreadcrumbItem', Component)
}
export default Component as IDefineComponent

View File

@@ -0,0 +1,15 @@
<template>
<a href="">{{title}}</a>
<span lay-separator="">/</span>
</template>
<script setup name="LayBreadcrumbItem" lang="ts">
import { defineProps } from 'vue'
const props =
defineProps<{
title: string
}>()
</script>