关于nuxt.js:nuxtjs-项目问题记录

37次阅读

共计 819 个字符，预计需要花费 3 分钟才能阅读完成。

1. 应用 swiper: 因为我的项目须要自动播放，swiper6 自动播放始终有效，后发现须要改成 swiper5。
版本别离为：”swiper”: “^5.4.5″,”vue-awesome-swiper”: “^4.1.1″。
nuxt.config.js:

nuxt-swiper-plugin.js:
配置属性：

2. 要实现的双向联动成果，点击左侧滑动到对应地位，滑动到某个地位，左侧对应模块选中：

遇到的问题：

始终为 0。
通过这种形式：

获取的值也为 0。
后发现：
这种形式能够获取到值，然而在 mounted 中能够获取到，后续获取也始终为 0。
实现代码：

handleScroll() { // 滑动监听

  let top = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop // 滚动条偏移量
  let scrollTop = top - this.topSet
  if (scrollTop >= this.topList[0] && scrollTop < this.topList[1]) {this.navIndex = 0} else if (scrollTop >= this.topList[1] && scrollTop < this.topList[2]) {this.navIndex = 1} else if (scrollTop >= this.topList[2]) {this.navIndex = 2} else if (scrollTop < this.topList[0]) {this.navIndex = -1}
  if (top > 50) {this.tellSign = true} else {this.tellSign = false}
},
jumpPage(index) {let PageId = this.topList[index];
  window.scrollTo({
    'top': PageId,
    'behavior': 'smooth'
  })
},

正文完