enn-breadcrumb

Breadcrumb

公共基础组件 面包屑组件

示例

<template>
  <div>
    <Breadcrumb :breadcrumbs="breadcrumbs" />
  </div>
</template>

<script>
import Breadcrumb from 'enn-breadcrumb';

export default {
  components: {
    Breadcrumb,
  },
  data() {
    return {
      breadcrumbs: [
        {
          name: 'test',
          label: 'test',
        },
      ],
    };
  },
}
</script>

API

Breadcrumb Attributes

参数	类型	必填	默认值	说明
breadcrumbs	Array		[{ label: '首页' }]	面包屑的数据
home	string		-	首页跳转的 name
useHistory	boolean		-	使用 history API 跳转首页的链接

Tips

• useHistory 主要用于微应用跳转至对应的首页

breadcrumbs Attributes

参数	类型	必填	默认值	说明
label	string	是	-	面包屑项显示的文案
to	string		-	路由跳转对象，同 vue-router 的 to
name	string		-	路由跳转 name
href	string		-	使用 history 进行路由跳转
query	Object		-	路由跳转的参数

Tips

• 其中 to 的优先级更高，设置了 to 之后将不读取 name 和 query。

配置函数

用于统一修改默认值，避免重复配置

事件名称	参数	说明
setDefaultHome	home 参数的默认值	统一配置默认的 home
setDefaultUseHistory	useHistory 参数的默认值	统一配置默认的 useHistory

本地测试

npm install

Compiles and hot-reloads for development

npm run dev