[Vuejs]-After changing vuejs's html heading by calling this.$refs, vuejs not updating that html element afterwards

You should never update the DOM of a Vue template directly – otherwise the synchronization between the virtual DOM and the real DOM will be lost and you will get all kinds of strange errors or awkward behavior.

Noone can save you from shooting yourself in the foot. Remove the last statement in your code and you will see that the title is properly updated.