| | |
| | | <template> |
| | | <div class="page-main" @scroll="throttledScrollHandler"> |
| | | <div class="page-content" :style="{ |
| | | <div |
| | | class="page-content" |
| | | :style="{ |
| | | fontSize: fontSize ? fontSize + 'px' : '16px', |
| | | transform: `scale(${pageZoom ? pageZoom : 1})`, |
| | | transformOrigin: 'center top', |
| | | }"> |
| | | <pageHeader v-if="showCatalogList.indexOf(1) > -1" :showPageList="loadPageList"></pageHeader> |
| | | <chapterOne v-if="showCatalogList.indexOf(2) > -1" :showPageList="loadPageList" /> |
| | | }" |
| | | > |
| | | <pageHeader |
| | | v-if="showCatalogList.indexOf(1) > -1" |
| | | :showPageList="loadPageList" |
| | | ></pageHeader> |
| | | <chapterOne |
| | | v-if="showCatalogList.indexOf(2) > -1" |
| | | :showPageList="loadPageList" |
| | | /> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | loadPageObserver: null, |
| | | loadPageList: [], |
| | | questionData: {}, |
| | | testData:{} |
| | | testData: {}, |
| | | }; |
| | | }, |
| | | watch: { |
| | |
| | | this.initObservation(); |
| | | this.initThemeColor(); |
| | | }, 500); |
| | | } |
| | | }, |
| | | }, |
| | | loadPageList: { |
| | | handler(newVal, oldVal) { |
| | |
| | | this.initSwiper(); |
| | | this.initViewer(); |
| | | }, 200); |
| | | } |
| | | } |
| | | }, |
| | | }, |
| | | }, |
| | | mounted() { |
| | | // 默认加载章节 |
| | |
| | | this.$store.state.qiankun.pageChange({ |
| | | page: page, |
| | | catalog: catalog, |
| | | text |
| | | text, |
| | | }); |
| | | // const sections = Array.from(document.querySelectorAll(".section")); |
| | | //sections:获取所有具有 .section 类名的元素,并转换为数组。 |
| | |
| | | // } |
| | | // } |
| | | this.loadPageList.push(Number(page)); |
| | | console.log('页码列表',this.loadPageList); |
| | | if (this.loadPageList.length > 5) { |
| | | // 超过5页 |
| | | this.loadPageList.shift(); |
| | |
| | | autoplay: { |
| | | //自动开始 |
| | | delay: 3000, //时间间隔 |
| | | disableOnInteraction: false //*手动操作轮播图后不会暂停* |
| | | disableOnInteraction: false, //*手动操作轮播图后不会暂停* |
| | | }, |
| | | paginationClickable: true, |
| | | slidesPerView: 1, // 一组三个 |
| | |
| | | // 如果需要前进后退按钮 |
| | | navigation: { |
| | | nextEl: ".swiper-button-next", |
| | | prevEl: ".swiper-button-prev" |
| | | prevEl: ".swiper-button-prev", |
| | | }, |
| | | // 窗口变化,重新init,针对F11全屏和放大缩小,必须加 |
| | | observer: true, |
| | |
| | | new Viewer(dom, { |
| | | navbar: true, // 显示导航栏 |
| | | toolbar: true, // 显示工具栏 |
| | | title: true // 显示标题 |
| | | title: true, // 显示标题 |
| | | }); |
| | | } |
| | | } |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |