Skip to content

ProHeader 标题组件

用于页面标题进行分割主次内容。

基础用法

large 尺寸
default 尺寸
small 尺寸
分割线
下边框
右侧插槽

<template>
  <div>
    <pro-header size="large">large 尺寸</pro-header>
    <pro-header size="default">default 尺寸</pro-header>
    <pro-header size="small">small 尺寸</pro-header>
    <pro-header divider>分割线</pro-header>
    <pro-header border>下边框</pro-header>
    <pro-header divider border>
      右侧插槽
      <template #right>
        <el-button type="primary" text>新增</el-button>
      </template>
    </pro-header>
  </div>
</template>

<script setup lang="ts">
import { ElButton } from 'element-plus'
</script>

<style scoped></style>

Attributes

属性名类型默认值说明
sizelarge | default | smalldefault尺寸
dividerbooleanfalse分割线
borderbooleanfalse下边框

Slots

插槽名说明
default默认插槽
right右侧插槽