this.rendition.on—touchstart、touchend ,next ，prev 等都没有作用，急等！

Question

按照老师的建议，修改了epubjs的版本：“0.3.71” 问题还是不能解决。

Answer 1

Sam 2019-01-24 10:43:23

使用你的代码，可以正确捕获到touch事件，注意要启动手机模式

• 提问者 weixin_慕仔3569560 #1

  原来如此！非常感谢！如果要在PC上使用，能用epub里面的捕获事件吗？

• Sam 回复 提问者 weixin_慕仔3569560 #2

  课程后面会介绍一种模板的做法，来解决PC和手机兼容的问题，另外，如果要使用Rendition.on的方案，可以捕获click事件，就可以同时支持PC和移动了

Answer 2

提问者 weixin_慕仔3569560 2019-01-24 10:18:13

<template>
<div>
<div id="read">
<!-- {{$route.params.fileName}} -->
<div class="ebook-reader"></div>
</div>
</div>
</template>

<script>
import Epub from "epubjs";
global.ePub = Epub;
import { mapGetters } from "vuex";

export default {
computed: {
...mapGetters(["fileName"])
},
methods: {
initEpub() {
const url = "" + this.fileName + ".epub";
console.log(url);
this.book = new Epub(url);
this.rendition = this.book.renderTo("read", {
width: innerWidth,
height: innerHeight,
method: "default"
});
this.rendition.display();
console.log(this.book);
console.log(this.rendition);
this.rendition.on("touchstart", event => {
console.log(event);
});
}
},
mounted() {
this.$store
.dispatch("setFileName", this.$route.params.fileName.split("|").join("/"))
.then(() => {
this.initEpub();
});
}
};
</script>

这是EbookReader.vue的代码，还需要别的吗？

Answer 3

Sam 2019-01-24 10:01:53

麻烦提供源码

Answer 4

提问者 weixin_慕仔3569560 2019-01-24 10:00:22

首页cover也出现了的。

Answer 5

提问者 weixin_慕仔3569560 2019-01-24 09:58:31

book，rendition对象都生成了。但是console有violation的警告，不知有无关系：

iframe.js?ddea:371 [Violation] Avoid using document.write().

Answer 6

Sam 2019-01-24 09:53:25

你好，可以查看一下日志，是否有报错信息？如果没有，依次排查Book、Rendition对象是否正确的生成，如果解析失败，是不能翻页或者支持手势的