为了账号安全,请及时绑定邮箱和手机立即绑定

电子书可以下载 但是没能解析和渲染 老师有时间可不可以帮我看看代码

电子书可以下载 但是没能解析和渲染 老师有时间可不可以帮我看看代码

正在回答

8 回答

你好,请将源码上传

0 回复 有任何疑惑可以回复我~
#1

qq_梦紫菱_0 提问者

非常感谢!
2018-08-23 回复 有任何疑惑可以回复我~
#2

Sam 回复 qq_梦紫菱_0 提问者

可以将源码整体上传到github,如果代码不多,可以将片段直接贴到回复中
2018-08-23 回复 有任何疑惑可以回复我~
#3

qq_梦紫菱_0 提问者 回复 Sam

https://gitee.com/Angela3104/epub 老师麻烦您看下 我上传了几个重要的文件夹 因为命令行上传有问题 所以那几个大的就没能上传
2018-08-23 回复 有任何疑惑可以回复我~
#4

qq_梦紫菱_0 提问者

老师您讲的让我豁然开朗,但是试了在浏览器运行依然没有显示 我在下面再贴一个截图 您看下是不是跟这些报错有关呢?
2018-08-23 回复 有任何疑惑可以回复我~
#5

qq_梦紫菱_0 提问者 回复 Sam

啊 终于出来了!谢谢老师!豁然开朗!真的感谢老师这么认真帮我看!感动?
2018-08-24 回复 有任何疑惑可以回复我~
#6

Sam 回复 qq_梦紫菱_0 提问者

不客气,继续努力!
2018-08-24 回复 有任何疑惑可以回复我~
查看3条回复

另一个问题是mounted()是vue的钩子函数,不能写到methods里面,将mounted()移到和methods平级,就可以了(mounted()写在methods里面会导致mounted不生效,所以在dom渲染完毕后浏览器不会执行showEpub()方法)

根据你的代码,我修改后附一份完整的代码,你可以和你的代码比对一下

<template>
  <div class="ebook">
    <div class="read-wrapper">
      <div id="read"></div>
    </div>
  </div>
</template>

<script>
 import Epub from 'epubjs'
 const urlm = '/static/2018_Book_AgileProcessesInSoftwareEngine.epub'
 global.epub = Epub
 export default {
   methods: {
     showEpub () {
       this.book = new Epub(urlm)
       this.rendition = this.book.renderTo('read', {
         width: window.innerWidth,
         height: window.innerHeight
       })
       this.rendition.display()
     }
   },
   mounted () {
     this.showEpub()
   }
}
</script>

<style lang="scss" scoped>
 @import 'assets/styles/global';
</style>


0 回复 有任何疑惑可以回复我~

你的问题是epubjs绑定的dom必须指定id,你写成了class,因为class不唯一,所以显示不出来

<template>
  <div class="ebook">
    <div class="read-wrapper">
      <div class="read">12345</div>
    </div>
  </div>
</template>

<div class="read">12345</div>

改为

<div id="read"></div>
0 回复 有任何疑惑可以回复我~
#1

qq_梦紫菱_0 提问者

还有就是console.log(this.book)在调试器里也没有像视频里您讲的那样出现书的相关
2018-08-23 回复 有任何疑惑可以回复我~
#2

qq_梦紫菱_0 提问者

或者老师您有没有整体的源码 我参考改下
2018-08-23 回复 有任何疑惑可以回复我~

我这边有些电子书也解析不出来,只有老师用的官网的例子可以解析出来.请问是和epubjs的版本有关么

1 回复 有任何疑惑可以回复我~

放到public里面就可以了

0 回复 有任何疑惑可以回复我~

这边调试问题有关系吗https://img1.sycdn.imooc.com//5b7e806b000164d604860555.jpg

0 回复 有任何疑惑可以回复我~
#1

Sam

这个不会影响调试,是由于eslint对你的代码进行静态检查,发现与预设的格式不符,要消除这些警告,将代码调整为正确的格式即可。比如第一条key-spacing的警告,是让你的代码"methods:{"中:"{"和":"之间加一个空格,即写成: methods: {
2018-08-23 回复 有任何疑惑可以回复我~
#2

qq_梦紫菱_0 提问者 回复 Sam

嗯嗯 但是read我也改成id了 还是显示不出电子书?
2018-08-23 回复 有任何疑惑可以回复我~
#3

Sam 回复 qq_梦紫菱_0 提问者

我用你的代码运行试试
2018-08-23 回复 有任何疑惑可以回复我~
#4

qq_梦紫菱_0 提问者 回复 Sam

嗯嗯 谢谢老师?
2018-08-23 回复 有任何疑惑可以回复我~
#5

Sam 回复 qq_梦紫菱_0 提问者

问题解决了,看下上面的回复
2018-08-23 回复 有任何疑惑可以回复我~
#6

qq_嶸歸_0 回复 Sam

我的问题和他一样,console.log(this.book)没效果,老师怎么解决
2018-09-12 回复 有任何疑惑可以回复我~
#7

努力赚钱的打工人 回复 qq_嶸歸_0

如果是vue-cli 3.0的话,放到public目录下即可。如果跟老师一样构建的话,可以试试用老师的电子书。我自己在网上随便下了epub格式的电子书就不能解析,代码啥的都没问题。
2019-01-26 回复 有任何疑惑可以回复我~
查看4条回复

https://img1.sycdn.imooc.com//5b7e668a000168f612240580.jpg

感觉并没有什么语法的问题啊 但就是渲染不出

0 回复 有任何疑惑可以回复我~

https://img1.sycdn.imooc.com//5b7e66130001841602460450.jpg

https://img1.sycdn.imooc.com//5b7e66130001f61002030464.jpg

epubjs的依赖也是有的

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

电子书可以下载 但是没能解析和渲染 老师有时间可不可以帮我看看代码

我要回答 关注问题
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号