How to Set the Page Title Dynamically with Vue.js?

Sometimes, we want to set the page title dynamically with Vue.js.

In this article, we’ll look at how to set the page title dynamically with Vue.js.

Set the Page Title Dynamically with Vue.js

We can set the page title dynamically with Vue.js by setting the document.title property to a string.

For instance, we can write:

<template>  
  <div id="app"></div>  
</template>  
<script>  
export default {  
  name: "App",  
  mounted() {  
    document.title = "page title";  
  },  
};  
</script>

We set the document.title to the string with the title content.

And we should see it at the top of the browser tab.

Conclusion

We can set the page title dynamically with Vue.js by setting the document.title property to a string.