vue如何监听window.onload事件

Question

vue项目中要用到一个js视差滚动插件skrollr.js，看了插件的官方说明要在document加载完后再调用插件的init方法初始化插件：

现在问题来了，在vue中怎么监听window.onload事件，网上搜了很多都说vue中基本是不会用到window.onload事件的，那插件的初始化写在哪呢？
下面是我写的代码：

这样写的话只有在第一次刷新进入页面的时候插件可以初始化成功，如果是从该页面进入别的页面以后再回来的话window的load事件就不会再执行了，插件无法初始化也就用不了。
试过不用load事件，直接将init()写在mounted生命周期函数中，也不行，直接写在script标签内也不行。

哪位大神遇到过的可以解答以下，万分感谢~

Answer 1

1. 纠正一下是进入别的页面还是进入别的路由。
2. 补充一下是每个路由页面有独立的视差效果还是只需要在根组件初始化一次。
3. 也不行的意识是init没执行？

使用单文件组件开发的vue程序，在vue代码开始运行之前就已经onload了(毕竟只有一个#app元素和几个js文件)。所以没必要监听onload。
同时可尝试在目标组件的mounted中使用this.$nexttick进行初始化，直接执行，不要加onload事件，同时由于vue的机制，重新进入路由页面时（非keep-alive）是重新创建的全新的dom元素，我觉得在销毁的时候需要手动解除视差效果，在进入后重新初始化。

---

mounted () {
  // this.$nextTick(() => {
    skrollr.init()
  // })
},
beforeDestroy () {
  let instance = skrollr.get()
  instance.destroy()
}

这类不依赖vue进行dom操作的第三方库，一般都需要你手动销毁。

Answer 2

vue的生命周期函数是监听vue组件运行时的各种状态， onload监听的是页面的事件，两者并无太大关系，如果只是需要在onload的时候init，那就完全不用写在vue组件里，写在script标签里就可以了。

Answer 3

其实，这里需要注意的就是 this 作用域的指向问题。

created: {
window.onload= () => {
    do something
}

Answer 4

你的vue组件使用缓存了吧，缓存后不执行mounted，你可以放在activated里面

Answer 5

以下原生js写法可以用来判断加载的状态：
document.onreadystatechange = function () {//即在加载的过程中执行下面的代码

     if(document.readyState=="complete"){//complete 加载完成
       ...
     }
 }

Answer 6

请问这个问题解决了吗