放大缩小修复位置乱跳

YM

2024-05-31 d3e0fef99029f60280afb96604371375a55ea8a8

 src/books/childHealth/view/content/index.vue

@@ -15,6 +15,8 @@
        v-if="showCatalogList.indexOf(1) > -1"
        :showPageList="loadPageList"
      ></pageHeader>
      <!-- <button @click="setZoom1">测试放大</button> -->
      <!-- <button @click="setZoom2">测试缩小</button> -->
      <chapterOne
        v-if="showCatalogList.indexOf(2) > -1"
        :showPageList="loadPageList"
@@ -157,6 +159,14 @@
          this.initViewer();
        }, 200);
      }
    },
    pageZoom: {
      handler(newVal, oldVal) {
        const scrollBox = (
          this.container ? this.container : document
        ).querySelector(".page-main");
        scrollBox.scrollTop = (scrollBox.scrollTop / oldVal) * newVal;
      }
    }
  },
  mounted() {
@@ -192,7 +202,7 @@
        // 跳转检索结果位置
        jumpSearchItem: (data) => {
          this.searchItemLocation(data);
        },
        }
      });
    }

@@ -249,6 +259,20 @@
    // }, 5000);
  },
  methods: {
    // setZoom1() {
    //   let scale = this.$store.state.qiankun.scale + 10;
    //   const scrollBox = (
    //     this.container ? this.container : document
    //   ).querySelector(".page-main");
    //   this.$store.commit("setZoom", scale);
    // },
    // setZoom2() {
    //   let scale = this.$store.state.qiankun.scale - 10;
    //   const scrollBox = (
    //     this.container ? this.container : document
    //   ).querySelector(".page-main");
    //   this.$store.commit("setZoom", scale);
    // },
    // 滚动监听
    scrollFun(event) {
      // 判断向上滚动还是向下滚动
@@ -633,7 +657,9 @@
                }
                for (let i = 0; i < allPageTextNodes.length; i++) {
                  const textDom = allPageTextNodes[i];
                  let txtIndex = textDom.textContent.indexOf(this.highlightData.txt);
                  let txtIndex = textDom.textContent.indexOf(
                    this.highlightData.txt
                  );
                  if (txtIndex > -1) {
                    textDom.parentNode.style.transition =
                      "background-color 0.8s";
@@ -709,7 +735,7 @@
          ),
          prevEl: (this.container ? this.container : document).querySelector(
            ".swiper-button-prev"
          ),
            )
        },
        // 窗口变化,重新init,针对F11全屏和放大缩小,必须加
        observer: true,
@@ -718,18 +744,18 @@
          init:(value) => {
            let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数）
            let totalPages = value.slides.length; // 获取总页数
            var paginationInfoEl = dom.querySelector('.pageBox');
              var paginationInfoEl = dom.querySelector(".pageBox");
            if(paginationInfoEl)
              paginationInfoEl.textContent = currentPage + '/' + totalPages;
                paginationInfoEl.textContent = currentPage + "/" + totalPages;
          },
          slideChange:(value) => {
            let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数）
            let totalPages = value.slides.length; // 获取总页数
            var paginationInfoEl = dom.querySelector('.pageBox');
              var paginationInfoEl = dom.querySelector(".pageBox");
            if(paginationInfoEl)
              paginationInfoEl.textContent = currentPage + '/' + totalPages;
          },
        },
                paginationInfoEl.textContent = currentPage + "/" + totalPages;
            }
          }
      });
      }
    },