preview image

🏠 Homepage

Author

👤 wangyongfeng

• Github: @imaoda

Introduction

在 H5 实现类似微信的图片预览功能，点击一个图片后：

• 黑色背景，全屏展示图片
• 图片支持手势缩放
• 点击任意区域，退出全屏预览

Usage

require react>16.3

yarn add rc-preview-image

预览图片

import prevewImage from 'rc-preview-image'

previewImage('/1.png')

Options

可选增加回调

previewImage('/1.png', {
    fail() {},
    success() {}
})

可选预览多张图片，用户可左右滑动来切换图片

previewImage(['/1.png', '/2,png'])

预览多张图片时，可指定从第几张开始显示

previewImage(['/1.png', '/2,png'], {current: 1})

Tips

• 支持 Typescript
• 支持返回 Promise