flipbook是Vue组件，可以像书籍一样以3D页面翻转效果显示图像。

变更日志：

v0.9.0（09/20/2020）

• 修复反应性

v0.8.1（04/06/2020）

• 错误修正

安装和下载：

# Yarn
$ yarn add flipbook-vue

# NPM
$ npm install flipbook-vue --save

用法：

<template>
  <flipbook class="flipbook" :pages="['array', 'of', 'image', 'URLs']"></flipbook>
  </template>
<style>
  .flipbook {
  width: 90vw;
  height: 90vh;
  }
  </style>

如果作为模块安装，

<script>
import Flipbook from 'flipbook-vue'
export default {
components: { Flipbook }
}
</script>

Props：

pages

图片网址数组。需要。所有图像应具有相同的宽高比。
如果第一个元素是null，则下一个元素单独显示（作为封面）。
所有其他道具都是可选的。

pagesHiRes

图片网址的高分辨率版本的数组。缩放时使用它们。

flipDuration

页面翻转动画的持续时间（以毫秒为单位）。预设为1000。

zoomDuration

放大/缩小动画的持续时间（以毫秒为单位）。默认值为500。

zooms

可能的放大倍数数组。 null等效于[1]（无缩放）。默认为[1, 2, 4]。

ambient

环境光的强度在0到1之间。值越小，阴影越多。默认为0.4。

gloss

镜面光的强度为0到1。值越高，光泽度越高。默认值为0.6。

perspective

屏幕和查看器之间的Z轴距离（以像素为单位）。值越高，效果越差。默认为2400

nPolygons

单页被水平分割成几个矩形。更高的值可以提供更高质量的渲染，以换取性能。默认为10

singlePage

不管视口大小如何，都强制为单页模式。默认为false。

forwardDirection

阅读方向。如果您的文档是从右到左，请设置为"left"。默认值为"right"。

centering

启用封面居中。默认值为true。

startPage

要打开的页码（> = 1）。默认值为null。

事件：

flip-left-start

当向左翻转动画开始时触发。参数是翻页前的页码。

flip-left-end

当向左翻转动画结束时触发。参数是翻转后的页码。

flip-right-start

当向右翻转动画开始时触发。参数是翻页前的页码。

flip-right-end

当向右翻转动画结束时触发。参数是翻转后的页码。

zoom-start

放大/缩小动画开始时触发。参数是缩放后的放大倍数。

zoom-end

放大/缩小动画结束时触发。参数是缩放后的放大倍数。

插槽props：

该组件将某些属性和方法公开为插槽属性。用法示例：

<flipbook :pages="pages" v-slot="flipbook">
<button @click="flipbook.flipLeft">Previous Page</button>
<button @click="flipbook.flipRight">Next Page</button>
</flipbook>

这些属性和方法也可以通过称为$refs给flipbook组件。

canFlipLeft

如果可以翻到上一页，则为true。

canFlipRight

如果可以翻到下一页，则为true。

canZoomIn

如果可以放大，则为true。

canZoomOut

如果可以缩小，则为true。

page

当前页码（1至numPages）。

numPages

总页数。

flipLeft()

翻到上一页的方法。

flipRight()

转到下一页的方法。

zoomIn()

放大方法。

zoomOut()

缩小方法。