实际使用过程中Vue的nextTick与setTimeout为什么还是有些差异？

作者站长头像
站长
· 阅读数 16

最近开发过程中使用到了swiper组件来显示轮播需求，轮播的内容由接口异步加载。在处理这块逻辑时发现了一个问题：当我在nextTick内部处理swiper初始化时，异步加载的数据并未显示，但是换成setTimeout时swiper可以成功显示，印象中不知道在哪里看到有一句话讲

引用当你想在vue中使用setTimeout时，你应该使用nextTick

所以在vue中上述这种情况导致的原因是什么呢，有没有比setTimeout更优雅的解决方式？

回复
1个回答
avatar
test
2024-07-11
我这样用是可以展示的呀
//拿到后端返回的数据
this.newBannerList = respData.body.bannerList
this.$nextTick(() => {
  // new Swiper
  this.initSwiper()
})
回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引，对解决问题有帮助
  • 遵循 Markdown 语法排版，代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容