1.0.1 • Published 2 years ago
image-magnifier-react v1.0.1
描述
image-magnifier-react 是 React 图片放大镜组件，鼠标经过会显示放大后的效果。
安装
npm install image-magnifier-react --save使用
- 引入
import Magnifier from 'image-magnifier-react';
import 'image-magnifier-react/lib/index.css'; // 引入样式- 使用
import demoImage from '../assets/demo.jpg';
...
<Magnifier image={demoImage} width={500} />属性
| 属性 | 描述 | 类型 | 默认值 | 是否必填 |
|---|---|---|---|---|
| image | 需要放大效果的图片 | string | 无 | 是 |
| zoom | 放大镜放大倍数 | number | 2 | |
| magnifierWidth | 放大镜宽度 | number | 100 | |
| magnifierHeight | 放大镜高度 | number | 100 | |
| borderWidth | 放大镜边框看宽度 | number | 2 | |
| borderColor | 放大镜边框颜色 | string | 'white' |