mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-12-11 23:00:20 +08:00
Code Issues Actions 30 Packages Projects Releases Wiki Activity
5a68bad59d
ant-design/components/image/demo/preview-group-top-progress.md
PCCCCCCC 9038524376
style: fix the style of progress rendering at the top of component Image PreviewGroup (#35092) 
* style: fix the style of progress rendering at the top of component Image PreviewGroup

* style: add debug-demo for top progress countRender
2022-04-19 17:07:57 +08:00

896 B
Raw Blame History

order title debug
100
zh-CN en-US
多图预览时顶部进度自定义 Top progress customization when previewing multiple images
true

zh-CN

多图预览时顶部展示进度, 支持自定义

en-US

The progress is displayed at the top of the multi-image preview, and customization is supported

import { Image } from 'antd';

const App = () => (
  <Image.PreviewGroup
    preview={{ countRender: (current, total) => `当前 ${current} / 总计 ${total}` }}
  >
    <Image width={150} src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" />
    <Image
      width={150}
      src="https://gw.alipayobjects.com/zos/antfincdn/aPkFc8Sj7n/method-draw-image.svg"
    />
    <Image
      width={150}
      src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
    />
  </Image.PreviewGroup>
);

export default App;