better-scroll 失效问题与求助

在使用better-scroll的时候，我将他封装成了一个组件，然后直接在项目中使用，代码如下：但出现了滚动失效的bug。

<template>
  <div class="wrapper" ref="wrapper">
    <div class="content">
      <slot></slot>
    </div>
  </div>
</template>


<scroll></scroll>

问题描述：

        今天在用better-scroll制作滚动的时候遇到了一个头疼的bug，滚动不起作用了！一开始以为是代码哪里写错了，于是上网寻找解决方案，可是没有找到任何解决的办法。DOM层级，样式定位什么的都没有问题，而且之前也成功的滚动过，但在刷新页面后滚动又失效了。有时候在vue重新编译的时候，滚动会突然的好起来，但是一刷新之后就又失效了。经过我不断的测试，我发现在用开发者工具切换一下设备工具栏的设备类型就能成功恢复滚动效果。better-scroll代码本身应该是没有问题的，这可能和Vue的生命周期有关系吧。

---

原因分析：

        查了很多奇葩的解决方案，很多大佬都说可能是跨域或者是服务器代理的问题，我一小萌新搞不懂这些。我觉得可能是因为better-scroll这个框架比较轻量，他在Vue将DOM元素生成之前就完成好了他的工作，但这时候啥都没有啊，于是他就啥都没干了，罢工了就。在页面布局重新刷新后，他才正常的工作了起来。在另外一个demo里，我没有封装better-scroll，而是在mounted钩子函数中直接使用他，就不会出现这种bug了，无论怎么刷新都能正常使用。

        封装的同样是在mounted钩子函数里的，但可能因为元素比较多，这个组件生成的时候，它里面的组件还在等待网络请求来数据呢，导致了better-scroll的失效。而demo由于非常简单，就没有出现这种问题。在封装better-scroll的时候外面再套一个setTimeout应该能解决问题

---

解决方案：

        在封装的时候设置一个延迟，setTimeout，让better-scroll延迟一会再开始他的工作。我发现在Vue里面好多东西都要设置一个延迟，让他等一等Vue，不然就会出现问题。Vue在加载的时候到底是怎么个操作的，这个问题虽然就这样解决了，但具体为什么我还是不太懂，可能还涉及浏览器的一些东西，这里就留个疑问，等以后实力变强了再回来看看。有大佬知道的话，就留个言吧谢谢咯。