老师关于目录的问题请教一下

Question

多级目录实现

我使用的vue的递归组件方式实现的，数据源用的是navigation.toc对象

let navigation = await this.currentBook.loaded.navigation;
 // 把这个目录信息写入vuex中
 this.setNavigation(navigation.toc);

没有使用老师的方法，现在我遇到了两个问题。

• 如何获取目录当前的页码，epubjs原生的toc对象里没有当前目录对应的页码，我也看了老师的源码，解析的时候也没有自己增加page这个属性，结果代码里就直接可以使用了page。
• 由于我没有采取一维数组的方式，导致我的没有数据源直接使用，取不到二级目录的名称

 getSectionName () {
      // 获取章节
      const section = this.currentBook.section(this.section); 
      let navigation = '';
      if (section) {
        // 获取章节名称
        navigation = this.currentBook.navigation.get(section.href);
      }
      return navigation.label;
    }

我查了epubjs的navigation手册，发现navigation.get只能获取当前section的一级目录名称，暂时没找到其他方法获取二级目录名称，老师知道有什么方法可以获取二级名称吗

Answer 1

Sam 2019-11-25 09:25:20

你好，有办法获取的，你可以重点看下：

this.book.loaded.navigation.then(nav => {})

解析目录主要就是针对上述代码的 nav 参数：

Navigation {…}
landmarks: (...)
landmarksByType: (...)
length: (...)
toc: Array(7)
tocByHref: (...)
tocById: (...)

nav.toc 就是目录，我们可以从 toc 中子元素的 subitems 中找到子目录

toc: Array(7)
0:
href: (...)
id: (...)
label: (...)
level: 0
page: 1
pagelist: []
parent: undefined
subitems: Array(0)

• 提问者 慕斯0315010 #1

  老师那怎么获取目录对应的页码？
  toc对象里没有页码相关信息。
  又没有其他api可以根据toc里的属性获取到页码？