[新增] buttonContainer 按钮容器

This commit is contained in:
就眠仪式 2021-09-27 14:08:05 +08:00
parent 5479eabf66
commit 3b60c0288b
4 changed files with 52 additions and 7 deletions

View File

@ -102,14 +102,14 @@ export default {
<template> <template>
<div> <div>
<lay-button-group> <lay-button-group>
<lay-button type="default" radius>默认按钮</lay-button> <lay-button type="default">默认按钮</lay-button>
<lay-button type="default" radius>默认按钮</lay-button> <lay-button type="default">默认按钮</lay-button>
<lay-button type="default" radius>默认按钮</lay-button> <lay-button type="default">默认按钮</lay-button>
</lay-button-group> </lay-button-group>
<lay-button-group> <lay-button-group>
<lay-button type="primary" radius>默认按钮</lay-button> <lay-button type="primary">默认按钮</lay-button>
<lay-button type="primary" radius>默认按钮</lay-button> <lay-button type="primary">默认按钮</lay-button>
<lay-button type="primary" radius>默认按钮</lay-button> <lay-button type="primary">默认按钮</lay-button>
</lay-button-group> </lay-button-group>
</div> </div>
</template> </template>
@ -127,3 +127,27 @@ export default {
</script> </script>
::: :::
::: demo 传入 columns 数据,自动生成表格
<template>
<lay-button-container>
<lay-button type="default">新增</lay-button>
<lay-button type="default">删除</lay-button>
<lay-button type="default">修改</lay-button>
</lay-button-container>
</template>
<script>
import { ref } from 'vue'
export default {
setup() {
return {
}
}
}
</script>
:::

View File

@ -4,6 +4,7 @@ import type { IDefineComponent, InstallOptions } from './module/type/index'
import "./css/layui.css"; import "./css/layui.css";
import LayRadio from './module/radio/index' import LayRadio from './module/radio/index'
import LayButton from './module/button/index' import LayButton from './module/button/index'
import LayButtonContainer from './module/buttonContainer/index'
import LayButtonGroup from './module/buttonGroup/index' import LayButtonGroup from './module/buttonGroup/index'
import LayIcon from './module/icon/index' import LayIcon from './module/icon/index'
import LayCard from './module/card/index' import LayCard from './module/card/index'
@ -29,7 +30,8 @@ const components: Record<string, IDefineComponent> = {
LayPanel, LayPanel,
LayCard, LayCard,
LayProgress, LayProgress,
LayButtonGroup LayButtonGroup,
LayButtonContainer
} }
const install = (app: App, options?: InstallOptions): void => { const install = (app: App, options?: InstallOptions): void => {
@ -56,6 +58,7 @@ export {
LayCard, LayCard,
LayProgress, LayProgress,
LayButtonGroup, LayButtonGroup,
LayButtonContainer,
install, install,
} }

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

View File

@ -0,0 +1,9 @@
<template>
<div class="layui-btn-container">
<slot></slot>
</div>
</template>
<script setup name="LayButtonContainer" lang="ts">
</script>