Shulou(Shulou.com)06/03 Report--

This article mainly introduces vue.js how to modify the page title, the article is very detailed, has a certain reference value, interested friends must read it!

Vue.js method to modify the page title: 1. Add title;2 to the required route in the routing file index.js and deal with it in the beforeEach interceptor of the route.

The operating environment of this paper: windows10 system, vue.js 2.9, thinkpad T480 computer.

When you open a web page, the page has a default title, which needs to be changed when we load different page content, such as from the home page to the details page, and then from the details page to the personal center.

There are many ways in vue to help us change the title of a web page. Here are two solutions.

Option 1 (not recommended):

Assign values to document.title in the Vue lifecycle function created directly in combination with business.

Import axios from 'axios'export default {created () {document.title =' function license'}}

Scenario 2 uses beforeEach interception of Vue-Router

Vue Router is used in the project to add title to the required routes in the routing file index.js.

Routes: [{path:'/', name: 'home', component: () = > import (' @ / pages/home/index'), meta: {title: 'home', keepAlive: true}}, {path:'/ person/auth, name: 'personAuth', component: () = > import (' @ / pages/person/auth) Meta: {title: 'personal Center', keepAlive: false}}]

Handled in the beforeEach interceptor of the route

Router.beforeEach ((to, from, next) = > {/ * routing change page title * / if (to.meta.title) {document.title = to.meta.title}}) these are all the contents of the article "how to modify the page title by vue.js". Thank you for reading! Hope to share the content to help you, more related knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.