fix: [Breadcrumb]Fix the problem that when BreadCrumb sets moreType to popover and MaxItem, the number of contents in the popup layer is incorrect (#1590)

cypress/integration/breadcrumb.spec.js

@@ -0,0 +1,7 @@
+describe('breadcrumb', () => {
+    it('moreType + maxItemCount', () => {
+        cy.visit('http://127.0.0.1:6006/iframe.html?id=breadcrumb--max-item-count-and-more-type&args=&viewMode=story');
+        cy.get('.semi-breadcrumb-item-more').trigger('mouseover');
+        cy.get('.semi-popover-content').children('.semi-breadcrumb-item-wrap').should('have.length', 2);
+    });
+});

packages/semi-ui/breadcrumb/_story/breadcrumb.stories.jsx

@@ -329,3 +329,14 @@ export const RenderMore = () => (
     </div>
   </div>
 );
+
+export const MaxItemCountAndMoreType = () => (
+  // 用于测试 moreType 为 popover, maxItemCount 自定义情况下，
+  // item 个数超出时候是否可弹出, 弹出层中内容是否正确
+  <Breadcrumb maxItemCount={2} moreType={'popover'}>
+    <Breadcrumb.Item>第一层</Breadcrumb.Item>
+    <Breadcrumb.Item>第二层</Breadcrumb.Item>
+    <Breadcrumb.Item>第二层</Breadcrumb.Item>
+    <Breadcrumb.Item>第四层</Breadcrumb.Item>
+  </Breadcrumb>
+);

packages/semi-ui/breadcrumb/index.tsx

@@ -162,7 +162,7 @@ class Breadcrumb extends BaseComponent<BreadcrumbProps, BreadcrumbState> {
     handleCollapse = (template: Array<React.ReactNode>, itemsLen: number) => {
         const { maxItemCount, renderMore, moreType } = this.props;
         const hasRenderMore = isFunction(renderMore);
-        const restItem = template.slice(1, itemsLen - 3);
+        const restItem = template.slice(1, itemsLen - maxItemCount + 1);
         const spread = (
             <span className={`${clsPrefix}-collapse`} key={`more-${itemsLen}`}>
                 <span className={`${clsPrefix}-item-wrap`}>