面包屑

更新时间:2023-08-22 02:13:08下载pdf

本文介绍了微应用的面包屑类型,并提供了无面包屑、展示微应用名称和自定义面包屑三种配置方法。

面包屑类型

微应用的面包屑有以下几种选项:

  • 无面包屑
  • 展示微应用名称
  • 自定义面包屑

类型一:无面包屑

不在组件内进行 setBreadcrumb 操作即可,如有,请移除该代码。

类型二:展示微应用名称

在组件内执行如下代码,面包屑位置将会展示微应用名称。

import { microProps } from 'src';

// 组件内
const { dynamicProps } = microProps;
dynamicProps.setBreadcrumb([{ type: 'auto' }]);

type:auto 表示自动匹配微应用名称。

面包屑

类型三:自定义面包屑

在组件内执行如下代码,面包屑位置将会展示自定义的内容。

import { microProps } from 'src';

// 组件内
const { dynamicProps } = microProps;
dynamicProps.setBreadcrumb([
  { type: 'c', name: 'breadcrumb-1', path: '/b-1' },
  { type: 'c', name: 'breadcrumb-2', path: '/b-2' },
  { type: 'c', name: 'breadcrumb-3', path: '/b-3' },
]);
  • type:c 表示类型为自定义。

  • name 作为展示的文案。

  • path 是链接地址,单击面包屑可跳转到目标地址。

    面包屑