[Vuejs]-Call next() when the data is fetched

by

1👍

✅

Yes, to do this you need to leverage beforeRouteEnter in your destination component, similar to the Vue Router docs here.

<script>
export default {
  beforeRouteEnter(to, from, next) {
    axios.get('/data/i/need')
      .then(function(response) {
        next(vm => {
          vm.myData = response.data // depends on the shape of your data and your destination component
        })
      })
      .catch(function(error) {
        next(false)  // or redirect to an error page?
      })
  }
}
</script>

If your route contains an id in the params, you can access it within beforeRouteEnter with to.params.myIdValueOrWhatever.

Leave a comment