Vue如何在数据渲染完之后再调用函数

背景：

“首页”有一些产品图片展示，点击某个产品就要转到“产品展示”页面的这个产品的位置。由于我的产品列表是从后台调用的，所以要等产品的id渲染完之后，才能调用跳转函数。

 

问题：

可能由于绑定数据比较慢，每次我的跳转函数执行的时候，它都获取不到对应id所在的产品，也就是null。

 

解决：

监听这个产品信息列表，当这个列表有数据了，再调用跳转函数。下面放代码：

watch: {
  'goodsList': function () {//'goodList'是我要渲染的对象，也就是我要等到它渲染完才能调用函数
    this.$nextTick(function () {
      this.gotoDetail();//这个是跳转函数
    })
  }
}