解决vue v-for渲染的异步请求数据无法使用better-scroll插件滚动问题

• 背景
  使用better-scroll插件实例化滚动列表，但列表中的数据是异步请求，有时列表中数据还没有渲染完成，插件就已经实例化导致bug，解决问题的根源在于令dom全部渲染完成后再实例化插件
  最简单的方法就是设置定时器，等待一定时间再实例化插件，但这种方法容易浪费时间等待或者等待时间不足仍然导致bug
• 较好的解决方法就是watch+vm.nextTick
  nextTich: 在下次 DOM 更新循环结束以后执行延迟回调。在修改数据以后当即使用这个方法，获取更新后的 DOM
  $nextTick 里面DOM更新是指页面上渲染的数据已经是最新的数据。而不仅是data的数据更新

那么我们可以用watch监听v-for渲染的列表数据，一旦该数据发生改变，说明异步请求更新了该数据，再使用this.$nextTick()函数执行回调，执行插件实例的refresh()方法即可

核心代码如下:

watch: {
    cities () {
      this.$nextTick(function () {
        this.scroll.refresh()
      })
    }
  }

其中，cities是滚动列表中动态渲染的数据