## OPPreviewImage 图片预览组件

```jsx
import React, { useState, useRef } from 'react';
import { Button, Icon, Box } from '@alife/cn-ui';
import ReactDOM from 'react-dom';
import { OPPreviewImage } from '../src/view';

const datas = [
  'https://img.alicdn.com/imgextra/i1/O1CN01Y2SOnw1RCqxJtE5iF_!!6000000002076-2-tps-528-712.png',
  'https://img.alicdn.com/imgextra/i3/O1CN01ZljOEh1DlI703Puek_!!6000000000256-0-tps-960-1280.jpg',
  'https://img.alicdn.com/imgextra/i2/O1CN01yeKSst1t4Qv6ED1QB_!!6000000005848-2-tps-520-476.png',
];

const OPPreviewImageComponent = () => {
  const ref = useRef();
  const preview = () => {
    ref.current.view(1);
  };
  return (
    <div>
      <OPPreviewImage data='https://img.alicdn.com/imgextra/i3/O1CN01OUMAU71ZUjLO2QQx9_!!6000000003198-2-tps-762-425.png'></OPPreviewImage>
      <OPPreviewImage
        viewRef={ref}
        numPerLine={3}
        data={datas}
      ></OPPreviewImage>
      <Button onClick={preview}>点击展示</Button>
    </div>
  );
};

ReactDOM.render(<OPPreviewImageComponent />, mountNode);
```

```css
.my-css {
  /* codes here */
  color: #fff;
}
```