1. PageHeader页头
1.1. 如果页面的路径比较简单, 推荐使用页头组件而非面包屑组件。
1.2. Attributes
参数 | 说明 | 类型 | 可选值 | 默认值 |
title | 标题 | string | 无 | 返回 |
content | 内容 | string | 无 |
1.3. Events
事件名称 | 说明 | 回调参数 |
back | 点击左侧区域触发 | 无 |
1.4. Slots
事件名称 | 说明 |
title | 标题内容 |
content | 内容 |
2. PageHeader页头例子
2.1. 使用脚手架新建一个名为element-ui-pageheader的前端项目, 同时安装Element插件。
2.2. 在components下创建PageHeader.vue
<template>
<div>
<h1>基础</h1>
<h4>如果页面的路径比较简单, 推荐使用页头组件而非面包屑组件。</h4>
<el-page-header @back="goBack" content="详情页面"></el-page-header>
</div>
</template>
<script>
export default {
methods: {
goBack () {
console.log('go back')
}
}
}
</script>
2.3. 运行项目, 访问http://localhost:8080/#/PageHeader