module-title 模块标题(齐思博)
业务模块标题,默认不带有展开收起。
基础用法
显示模块标题,显示右侧展开/收起。
type为unfold时,v-model必填
标题false
展开
<template>
<div style="width: 200px">
<h-module-title v-model="hconfirm1" title="标题" type="unfold">
<template #title>
{{ hconfirm1 }}
</template>
</h-module-title>
</div>
</template>
<script setup>
import {
ref
} from 'vue';
let hconfirm1 = ref(false);
</script>
自定义
默认类型,自定义右侧按钮区域。
标题
<template>
<div>
<h-module-title title="标题">
<template #operation>
<el-button type="second">上一步</el-button>
<el-button>保存并下一步</el-button>
</template>
</h-module-title>
</div>
</template>
Attributes(支持elementUI-Dialog对话框所有配置)
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| title | 标题 | string | — | — |
| type | 显示类型 | string | unfold | 空 |
| value / v-model | 展开收起绑定值 | boolean | true/false | false |
Slot
| name | 说明 |
|---|---|
| title | 标题区内容 |
| operation | 右侧按钮区域 |
Events
| 方法名 | 说明 | 参数 |
|---|---|---|
| input | 展开、收起时触发 | 当前值 |
| change | 展开、收起时触发 | 当前值 |