Installation

npm install @wm-hosp/weimeng-hosp-preview --save

Usage

import * as React from 'react';
import { openPicturePreview } from '@wm-hosp/weimeng-hosp-preview';

class App extends React.Component<any, any> {
  constructor() {
    super();
  }

  render() {
    return (
      <div>
        <button
          onClick={() => {
            openPicturePreview({
              imgList: [
                {
                  title: '',
                  src: '',
                  alt: '',
                  showOtherInfo: [
                    {
                      label: '',
                      value: '',
                    },
                  ],
                },
              ],
            });
          }}
        >
          预览图片
        </button>
      </div>
    );
  }
}

Props

| props | type | default | description | required | | --------------- | ----------------------------------------------------------------------------- | ------- | ------------------------------- | -------- | | imgList | imgListProps[] | [] | image source array | true | | currentClickImg | string | - | current image title | false | | noNavbar | boolean | false | to not render the navbar | false | | noToolbar | boolean | false | to not render the toolbar | false | | noFooter | boolean | false | to not render the entire footer | false | | changeable | boolean | true | wheather to show change button | false | | customToolbar | (defaultToolbarConfigs: ToolbarConfig[]) => ToolbarConfig[] | - | customer toolbar | false | | zoomSpeed | number | 0.05 | zoom speed | false | | defaultScale | number | 1 | set default scale | false |

imgListProps

| props | type | default | description | required | | ------------- | ----------------------------------------- | ------- | ------------------ | -------- | | src | string | - | image source | true | | alt | string | - | image description | false | | title | string | - | image tite | false | | downloadUrl | string | - | image downlaod url | false | | showOtherInfo | showOtherInfoProps | - | image description | false |

注：src 如果是 pdf 链接格式，如果带*&name*则是原链接就带.pdf 后缀，若不存在则是手动添加，运行会将.pdf 后缀去掉

showOtherInfoProps

| props | type | default | description | required | | ----- | ------ | ------- | ----------- | -------- | | lable | string | - | description | false | | value | string | - | description | false |

ToolbarConfig

| props | type | default | description | required | | ------- | --------------- | ------- | ---------------------------------------- | -------- | | key | string | - | tool key | true | | render | React.ReactNode | - | tool render | false | | onClick | function | - | callback function when action is clicked | false |