diff --git a/docs/examples/simple.tsx b/docs/examples/simple.tsx index d04b9b53..3469f6b9 100644 --- a/docs/examples/simple.tsx +++ b/docs/examples/simple.tsx @@ -32,6 +32,18 @@ export default () => { showSizeChanger selectComponentClass={Select} /> +
+ + Antd #46671 + + ); }; diff --git a/src/Pagination.tsx b/src/Pagination.tsx index 31626e2e..b3c6763c 100644 --- a/src/Pagination.tsx +++ b/src/Pagination.tsx @@ -348,27 +348,32 @@ const Pagination: React.FC = (props) => { let simplePager: React.ReactNode = null; if (simple) { - if (typeof goButton === 'boolean') { + // ====== Simple quick jump ====== + if (goButton) { + if (typeof goButton === 'boolean') { + gotoButton = ( + + ); + } else { + gotoButton = ( + + {goButton} + + ); + } + gotoButton = ( - +
  • + {gotoButton} +
    • ); - } else { - - {goButton} - ; } - gotoButton = ( -
  • - {gotoButton} -
    • - ); - simplePager = (
  • -
  • -
    • -
  • - - 1 - -
    • -
  • - - 2 - -
    • -
  • - - 3 - -
    • -
  • -
    • - -`; - -exports[`Example controlled 1`] = ` - -`; - -exports[`Example itemRender 1`] = ` - -`; - -exports[`Example jumper 1`] = ` -

    - 默认 -

    -`; - -exports[`Example jumperWithGoButton 1`] = ` -

    - customize node -

    -`; - -exports[`Example lessPages 1`] = `
    • - - - - - +
    • @@ -303,7 +40,7 @@ exports[`Example lessPages 1`] = `
    • @@ -313,79 +50,18 @@ exports[`Example lessPages 1`] = ` 3
      • -
    • - - 4 - -
      • -
    • - - - - - - -
      • -
    • - - 8 - -
    • - - - - - +
      • -
      - - - - - + type="button" + />
    • @@ -447,39 +112,25 @@ exports[`Example lessPages 1`] = `
    • - - - - - - + 4 +
    • - 6 + 5
    • - - - - - +
      • -
    -
    - - - Is using icon: - true - -
    -
    -`; - -exports[`Example locale 1`] = ` - -`; - -exports[`Example more 1`] = ` - -`; - -exports[`Example showTitle 1`] = ` -
    -
    -`; - -exports[`Example showTotal 1`] = ` - -`; - -exports[`Example simple 1`] = ` - -`; - -exports[`Example sizer 1`] = ` -
    -
    • @@ -1152,7 +389,7 @@ exports[`Example sizer 1`] = `
    • @@ -1163,75 +400,82 @@ exports[`Example sizer 1`] = `
    • + + 4 + +
      • +
    • + + 5 + +
      • +
    • -
      -
      - - - - - 15 条/页 - -
      -
      + 8 + +
      • +
    • +
      • +
    • @@ -1253,7 +497,7 @@ exports[`Example sizer 1`] = `
    • @@ -1274,6 +518,39 @@ exports[`Example sizer 1`] = ` 4
      • +
    • + + 5 + +
      • +
    • +
      • +
    • + + 9 + +
      • +
    • @@ -1325,7 +605,7 @@ exports[`Example sizer 1`] = `
    • @@ -1346,6 +626,39 @@ exports[`Example sizer 1`] = ` 4
      • +
    • + + 5 + +
      • +
    • +
      • +
    • + + 10 + +
    • -
      -
      - - - - - 15 条/页 - -
      -
      -
      • + />
    • @@ -1437,7 +713,7 @@ exports[`Example sizer 1`] = `
    • @@ -1458,6 +734,39 @@ exports[`Example sizer 1`] = ` 4
      • +
    • + + 5 + +
      • +
    • +
      • +
    • + + 12 + +
      • -
    +
  • + + +
    • +`; + +exports[`Example controlled 1`] = ` +
    + +
    +`; + +exports[`Example itemRender 1`] = ` +
    + + + + +
    +`; + +exports[`Example jumper 1`] = ` +
    +

    + 默认 +

    + +

    + 禁用 +

    + +

    + 单页默认隐藏 +

    +
      +
    • +
      • +
    • + + 1 + +
      • +
    • +
      • +
    • +
      +
      + + + + + 10 条/页 + +
      +
      +
      • +
    +
    +
      +
    • +
      • +
    • + + 1 + +
      • +
    • +
      • +
    • +
      +
      + + + + + 10 条/页 + +
      +
      +
      • +
    +
    +`; + +exports[`Example jumperWithGoButton 1`] = ` +
    +

    + customize node +

    + +

    + default node +

    +
      +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    • +
      + 跳至 + + 页 + +
    • + +
      • + +
    + + + +`; + +exports[`Example lessPages 1`] = ` +
    +
    + + +
    + + + Is using icon: + true + +
    +
    +
    +`; + +exports[`Example locale 1`] = ` +
    + +
    +`; + +exports[`Example more 1`] = ` +
    + +
    +`; + +exports[`Example showTitle 1`] = ` +
    +
    + + +
    +
    +`; + +exports[`Example showTotal 1`] = ` +
    + +
    + +
    +
      +
    • + 0 - 0 of 0 items +
      • +
    • +
      • +
    • + + 1 + +
      • +
    • +
      • +
    +
    +`; + +exports[`Example simple 1`] = ` +
    + +
      +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    +
    +
      +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    +
    +
      +
    • + Total 50 items +
      • +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    +
    +
      +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    • +
      +
      + + + + + 10 条/页 + +
      +
      +
      • +
    +
    + + Antd #46671 + +
      +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    • +
      +
      + + + + + 10 条/页 + +
      +
      +
      + 跳至 + + 页 +
      +
      • +
    `; -exports[`Example styles 1`] = ` - + + + + + +`; + +exports[`Example styles 1`] = ` +
    +
      -
    +
  • +
    • +
  • + + 1 + +
    • +
  • + + 2 + +
    • +
  • + + 3 + +
    • +
  • +
    • + +
    `; diff --git a/tests/__snapshots__/simple.test.tsx.snap b/tests/__snapshots__/simple.test.tsx.snap new file mode 100644 index 00000000..8dee2660 --- /dev/null +++ b/tests/__snapshots__/simple.test.tsx.snap @@ -0,0 +1,69 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`simple Pagination props: showQuickJumper should render normally quick-jumper 1`] = ` +
    + 跳至 + + 页 +
    +`; + +exports[`simple Pagination props: showQuickJumper should render normally quick-jumper with custom goButton 1`] = ` +
    + 跳至 + + 页 + +
  • + + + +
    • +     +
    +`; + +exports[`simple Pagination props: showQuickJumper should render normally quick-jumper with goButton 1`] = ` +
    + 跳至 + + 页 + +
  • + +
    • +     +
    +`; diff --git a/tests/demo.test.tsx b/tests/demo.test.tsx index bca40e84..577e5cf7 100644 --- a/tests/demo.test.tsx +++ b/tests/demo.test.tsx @@ -15,7 +15,7 @@ describe('Example', () => { const Example = require(path.join(exampleDir, file)).default; const { container } = render(); - expect(container.firstChild).toMatchSnapshot(); + expect(container).toMatchSnapshot(); }); }); }); diff --git a/tests/simple.test.tsx b/tests/simple.test.tsx index 4845a0e5..c02e8d19 100644 --- a/tests/simple.test.tsx +++ b/tests/simple.test.tsx @@ -249,4 +249,54 @@ describe('simple Pagination', () => { fireEvent.click(button); expect(input).toHaveProperty('value', '2'); }); + + // 修复 4.0.0 重构导致的问题: https://github.com/ant-design/ant-design/issues/46671 + describe('props: showQuickJumper', () => { + const Demo: typeof Pagination = (props) => ( + + ); + + it('should render normally quick-jumper', () => { + const { container } = render(); + + const quickJumper = container.querySelector( + '.rc-pagination-options-quick-jumper', + ); + expect(quickJumper).toBeTruthy(); + expect(quickJumper).toMatchSnapshot(); + }); + + it('should render normally quick-jumper with goButton', () => { + const { container } = render( + , + ); + + const quickJumper = container.querySelector( + '.rc-pagination-options-quick-jumper', + ); + expect(quickJumper).toBeTruthy(); + expect(quickJumper).toMatchSnapshot(); + }); + + // custom goButton + it('should render normally quick-jumper with custom goButton', () => { + const { container } = render( + go }} + />, + ); + + const quickJumper = container.querySelector( + '.rc-pagination-options-quick-jumper', + ); + expect(quickJumper.querySelector('.foo')).toBeTruthy(); + expect(quickJumper).toMatchSnapshot(); + }); + }); });