欢迎使用
效果展示:https://zuowb.cn/(欢迎收藏使用)
所用技术
vue2.0,epub.js,IndexDB,webpack14.0
epub.js介绍
gittub地址:https://github.com/futurepress/epub.js
官方文档:http://epubjs.org/documentation/0.3/
获取epub.js
npm install epub.js
在项目中导入对应库
import ePub from 'epubjs'
基础 方法:
//首先获取book对象
//使用文件地址导入
var book = ePub('/book/xxx.epub')
//或者使用ArrayBuffer导入
//var book = ePub(arrayBuffer)
//绑定到页面上对应id的元素上如<div id='readHere'> </div>
var rendition = book.renderTo('readHere',{
width:'100%', //也可以是'980px'这样的
height:'100%',
flow:'paginated' //默认是'paginated',是分页模式,'scrolled-doc'是滚动式
})//其它参数具体可以参考官方文档
//渲染到页面上
rendition.display() //显示第一页 //现在可以看到页面上显示书籍了
//实现翻页
rendition.prev() //下一页
rendition.next() //上一页 //现在可以一口气将一本书从头看到尾了
//获取目录对象
book.ready.then(()=>{
var catalog = that.navigation.toc //获得一个对象数组,包含每一章节题目和跳转地址。
return book.locations.generate() //返回一个全书的解析,包括cfi与percentage的详细对应信息