Comment définir le titre dans vuejs-Voir.js-php.cn

Comment définir le titre dans vuejs : 1. Installez "vue-wechat-title" via npm install ; 2. Introduisez "vue-wechat-title" dans main.js 3. Ajoutez chaque route dans index.js Juste le titre.

Comment définir le titre dans vuejs

L'environnement d'exploitation de cet article : système Windows 7, Vue version 2.9.6, ordinateur Dell G3.

Comment définir le titre dans vuejs ?

vue titre de définition d'une page unique titre

Les frameworks front-end tels queVue, React, etc. sont des applications d'une seule page, et l'ensemble du Web le site est en fait une page d'index, les sauts de page remplacent le contenu dans index.html. Ceci est différent de la pratique traditionnelle consistant à définir la balise de titre sur chaque page.Vue、React等都是单页面的应用，整个web站点其实是一个index页面，页面跳转都是替换index.html里边的内容。这与传统的每个页面设置title标签的做法不一样。

推荐使用 vue-wechat-title

vue-wechat-title作用

Vuejs 单页应用在iOS系统下部分APP的webview中标题不能通过 document.title = xxx 的方式修改该插件只为解决该问题而生(兼容安卓)

已测试APP
微信
QQ
支付宝
淘宝

安装

npm install vue-wechat-title --save

Copier après la connexion

用法

1，在`main.js`中引入

import VueWechatTitle from 'vue-wechat-title'Vue.use(VueWechatTitle)

Copier après la connexion

2，在路由文件`index.js`中给每个路由添加`title`

// 挂载路由const router = new Router({ mode: 'history', routes:[ { path: '/', name: 'Index', component: Index, meta: { title: '首页' // 标题设置 } }, { path: '/lists', name: 'Lists', component: Lists, meta: { title: '列表' // 标题设置 } } ] });

Copier après la connexion

3，在`app.vue`中修改`router-view`

Il est recommandé d'utiliser vue-wechat-title

fonction vue-wechat-title
Application monopage Vuejs Dans la vue Web de certaines applications sous le système iOS , le titre ne peut pas transmettre le document. Modifiez le plug-in avec title = xxx uniquement pour résoudre ce problème (compatible avec Android)
APP testée
WeChat
QQ
Alipay
Taobao

Installation

Copier après la connexion

Utilisation

1, dansmain.jsIntroduisez

Copier après la connexion

2 à chaque route dans le fichier de routage-indexjs-, ajoutez`title à chaque route dans le fichier de routage index.js rrreee`


       3, modifiezrouter-viewdansapp.vue> Le l'adresse par défaut de l'image chargée personnalisée du composant
        rrreee est ./favicon.ico, qui peut être relative ou absolue rrreeeok ! Redémarrez et jetez un oeilApprentissage recommandé : "tutoriel vue"
       Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Php8, je viens aussi

Apprenez la mise en page d'un site Web en 30 minutes

Tutoriel vidéo Shangguan Oracle débutant à compétent

Votre première ligne de code UNI-APP

Flutter de zéro au lancement de l'application

Brother Lian Nouveau didacticiel vidéo Linux

Tutoriel vidéo AXURE 9 (convient à l'interface utilisateur interactive de conception de produits du chef de produit)

Tutoriel vidéo PS Zero Basic Proficiency

Tutoriel vidéo de 16 jours sur l'interface utilisateur pour vous aider à démarrer

Tutoriel vidéo sur les techniques PS et les techniques de découpage

Tutoriel vidéo sur la construction et le lancement de projets d'Alibaba Cloud Environment

Présentation des réseaux informatiques - Connaissances de base que les programmeurs doivent maîtriser

Tutoriel essentiel pour les programmeurs - Explication du protocole HTTP

Tutoriel vidéo Websocket

Comment définir le titre dans vuejs

vue-wechat-title作用

安装

用法

1，在`main.js`中引入

2，在路由文件`index.js`中给每个路由添加`title`

3，在`app.vue`中修改`router-view`

Installation

Utilisation

1, dans`main.js`Introduisez

Copier après la connexion

2 à chaque route dans le fichier de routage-indexjs-, ajoutez`title à chaque route dans le fichier de routage index.js rrreee`

3, modifiez`router-view`dans`app.vue`> Le l'adresse par défaut de l'image chargée personnalisée du composant rrreee est ./favicon.ico, qui peut être relative ou absolue rrreeeok ! Redémarrez et jetez un oeilApprentissage recommandé : "tutoriel vue"

Comment définir le titre dans vuejs

vue-wechat-title作用

安装

用法

1，在main.js中引入

2，在路由文件index.js中给每个路由添加title

3，在app.vue中修改router-view

fonction vue-wechat-titleApplication monopage Vuejs Dans la vue Web de certaines applications sous le système iOS , le titre ne peut pas transmettre le document. Modifiez le plug-in avec title = xxx uniquement pour résoudre ce problème (compatible avec Android)APP testéeWeChatQQAlipayTaobao

Installation

Utilisation

1, dansmain.jsIntroduisez Copier après la connexion

2 à chaque route dans le fichier de routage-indexjs-, ajouteztitle à chaque route dans le fichier de routage index.js rrreee

3, modifiezrouter-viewdansapp.vue> Le l'adresse par défaut de l'image chargée personnalisée du composant rrreee est ./favicon.ico, qui peut être relative ou absolue rrreeeok ! Redémarrez et jetez un oeilApprentissage recommandé : "tutoriel vue"

1，在`main.js`中引入

2，在路由文件`index.js`中给每个路由添加`title`

3，在`app.vue`中修改`router-view`

1, dans`main.js`Introduisez

Copier après la connexion

2 à chaque route dans le fichier de routage-indexjs-, ajoutez`title à chaque route dans le fichier de routage index.js rrreee`

3, modifiez`router-view`dans`app.vue`> Le l'adresse par défaut de l'image chargée personnalisée du composant rrreee est ./favicon.ico, qui peut être relative ou absolue rrreeeok ! Redémarrez et jetez un oeilApprentissage recommandé : "tutoriel vue"