How to dynamically change title in vuejs

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

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

Dynamicly modify the page title in the Vue project

In main.js:

// 设置浏览器标题
Vue.directive('title', {
  inserted: function (el, binding) {
    document.title = el.dataset.title
  }
})

On the largest div of a certain page:

Add the following code:

v-title data-title="测试title"

Effect:

Related recommendations: "vue.js Tutorial"

The above is the detailed content of How to dynamically change title in vuejs. For more information, please follow other related articles on the PHP Chinese website!