样式问题，已经解决

翻页的时候获取当前位置

this.rendition.currentLocation().start.percentage

在把当前位置赋值给进度条（或者进行绑定）

翻页的时候获取当前位置

this.rendition.currentLocation().start.percentage

在把当前位置赋值给进度条（或者进行绑定）

解决了，样式问题

我也是这个问题， 百思不得其解， 这个locations.generate 它会加载所有章节， 不用又不行， 百思不得其解啊。

它的locations如果html模版里没有用到，data里就不用声明。

那个你们有报错么，我刚解决了。一点点查的代码，我的是因为showEpub中的某个的某个方法中的this拼写错误，showEpub还没执行到book对象的钩子函数那就因为错误跳出了

出现蓝框应该是input的outline吧,把outline设置成none.

/*横条样式*/
input[type=range] {
  -webkit-appearance: none;/*清除系统默认样式*/
  outline: none;
}
 
/*拖动块的样式*/
input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;/*清除系统默认样式*/
}

楼上说的这个 不是中文的呀

$event 指事件对象， $event.target 指向触发当前事件的 dom 元素，$event.target.value 就是触发当前事件的dom的value属性

很直观的能看到，linear-gradient是background-image属性的值，而颜色是background-color

这个问题有点大,你需要了解的知识点是:

1,js为什么要设计为单线程,单线程的优点及缺点,引出异步的概念

2,了解eventloop机制,弄清楚异步函数是如何执行的

3,更深入了解的话异步又分macrotask和microtask.其中promise方法属于microtask.这里的this.book.ready.then显然就是promise对象.

4,此时你得好好研究promise对象.这是es6里非常重要的对象

5,在研究过程中你会看到很多()=>{}这样的箭头函数,这也是es6里的新内容.

到此这个问题应该能解决了.(这5点都是长篇大论需要花时间去琢磨)

你好，子组件自身的方法，原则上，尽量写在子组件当中，以减少子组件与父组件的耦合度。某些方法用在子组件中，但是定义在父组件，是因为要用到在父组件中定义的变量。

你好，应该是MenuBar组件中没有定义navigatin和bookAvailable变量，所以引用不到

你好，可以排查一下：点击事件是否生效和目录的href属性是否获取成功

你好，能提供一下源码吗？初步判断是backgroundSize属性设置的问题

你好，从源码看没什么问题，可以考虑book对象解析是否出了问题，或者其他错误导致this.book.ready没有触发成功

你好，应该是相对定位设置的问题，进度条的百分比文字应该相当于进度条面板进行绝对定位

你好，本课程动手实践很重要哦，期待你根据课程讲解，一步步实现一个属于自己的阅读器：）

我知道问题出哪了，打扰了..........

你好，ref的官方定义如下：

ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上。

这里我用通俗地解释一下，比如：我们定义一个dom

<div class="a" ref="divA"></div>

如果我们想获取这个div对象，用js写法应该是这样的：

const div = document.getElementsByClassName('divA')

用vue可以这样来实现同样的效果：

const div = this.$refs.divA

因为这个div使用ref属性进行了注册，所以在Vue实例中，这个div对象会被添加到Vue.$refs这个对象下，所以我们就可以通过

Vue.$refs.xxx

来直接获取这个对象了

可以参考官方提供的例子：

// Wait for book to be rendered to get current page
displayed.then(function(){
  // Get the current CFI
  var currentLocation = rendition.currentLocation();
  // Get the Percentage (or location) from that CFI
  var currentPage = book.locations.percentageFromCfi(currentLocation.start.cfi);
  slider.value = currentPage;
  currentPage.value = currentPage;
});