Anchor navigation when using Vue Route?

Question

Vue.js

I intercept the beforeRouteEnter/beforeRouteUpdate events, in it I load the page via ajax and write it to a variable and display it. But when following the anchor link, a problem arises: the page is successfully loaded and displayed, but the transition to the anchor does not occur.

Can anyone come across?

Answer 1

I think it should be done like this:

beforeRouteEnter (to, from, next) {
  getData((data) => {
    next(vm => {
      vm.setData(data);
      vm.$nextTick(() => document.location.hash = '#anchor');
    });
  });
},

that is, we wait for data, we wait for drawing, we pass to the anchor