How vuejs dynamically changes title

This article mainly shows you "how vuejs dynamically changes title", the content is easy to understand, clear, hope to help you solve your doubts, the following let the editor lead you to study and learn "how vuejs dynamically changes title" this article.

Dynamically change the title method: 1, in the "main.js" in the use of "document.title=el.dataset.title" to configure the browser title; 2, in the page tag, add "v-title data-title=" title value "" code can be dynamically changed.

The operating environment of this tutorial: windows7 system, vue2.9.6 version, DELL G3 computer.

Dynamically modify the page title in the Vue project

In main.js:

/ / set browser title Vue.directive ('title', {inserted: function (el, binding) {document.title = el.dataset.title}})

On the largest div of a page:

Add the following code:

V-title data-title= "Test title"

Effect:

The above is all the content of the article "how vuejs dynamically changes title". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!