vue项目 H5 动态设置浏览器标题

news2024/11/17 11:50:43

1,先将要展示的标题存本地
 

	if (that.PromotionInfo.Title) {
							localStorage.setItem("AcTitle", that.PromotionInfo.Title)
						}

2,现在路由meta中设置标题,再在路由守卫中设置

import Vue from 'vue'
import Router from 'vue-router'
import promptDetail from './views/promptDetail'

Vue.use(Router)
const router = new Router({
  routes: [
	{
		  //活动详情
		    path: '/',
		    name: 'promptDetail',
			meta:{title:localStorage.getItem("AcTitle")},
		    component: promptDetail
		},
	
  ],
 
})
router.beforeEach((to,from,next)=>{//beforeEach是router的钩子函数,在进入路由前执行
    if(to.meta.title){//判断是否有标题
        document.title = to.meta.title
    }
	
    next()  //执行进入路由,如果不写就不会进入目标页
})
 
export default router


哦买噶~本地是可以的,生产环境就不行了,
解决办法

 

if (that.PromotionInfo.Title) {
							// localStorage.setItem("AcTitle", that.PromotionInfo.Title)
							console.log("页面设置",document.title);
							 document.title = that.PromotionInfo.Title;
							 	console.log("页面设置之后",document.title);
						}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1040168.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

游戏录屏软件推荐,教你录制高清游戏视频

“有没有好用的游戏录屏软件推荐呀,最近当上了游戏主播,平台要求每天都要发一个游戏视频,可是我的游戏录屏软件太拉胯了,录制出来的视频非常糊,导致平台审核不通过,所以想问问大家有没有游戏录屏软件推荐一…

机器视觉检测在流水线上的技术应用

机器视觉在流水线上的应用机器视觉系统的主要功能可以简单概括为:定位、识别、测量、缺陷检测等。相对于人工或传统机械方式而言,机器视觉系统具有速度快、精度高、准确性高等一系列优点。随着工业现代化发展,机器视觉已经广泛应用于各大领域…

【Git】轻松学会 Git:实现 Git 的分支管理

文章目录 前言一、对分支的理解二、分支的创建三、分支的切换3.1 切换到 dev 分支3.2 在 dev 分支上进行文件的修改和提交3.2 来回切换 master 和 dev 分支,查看修改的内容 四、分支的合并五、分支的删除六、冲突的合并6.1 模拟制造冲突6.2 解决冲突 七、分支管理策…

openGauss学习笔记-79 openGauss 数据库管理-内存优化表MOT管理-内存表特性-MOT应用场景

文章目录 openGauss学习笔记-79 openGauss 数据库管理-内存优化表MOT管理-内存表特性-MOT应用场景79 MOT应用场景 openGauss学习笔记-79 openGauss 数据库管理-内存优化表MOT管理-内存表特性-MOT应用场景 本节介绍了openGauss内存优化表(Memory-Optimized Table&am…

Java基于基于微信小程序的快递柜管理系统

博主介绍:✌程序员徐师兄、7年大厂程序员经历。全网粉丝30W、csdn博客专家、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 文章目录 第一章:简介第二章、***\*开发环境:\******后端:****前端&am…

msvcp110.dll丢失是什么意思?msvcp110.dll丢失的五种修复方法

在现代社会,计算机已经成为我们生活和工作中不可或缺的一部分。然而,随着计算机技术的不断发展,我们也会遇到各种各样的问题。其中,msvcp110.dll丢失是许多用户经常遇到的问题之一。本文将详细介绍msvcp110.dll丢失的修复方法&…

基于微信小程序的健身房私教预约平台设计与实现(源码+lw+部署文档+讲解等)

文章目录 前言系统主要功能:具体实现截图论文参考详细视频演示为什么选择我自己的网站自己的小程序(小蔡coding)有保障的售后福利 代码参考源码获取 前言 💗博主介绍:✌全网粉丝10W,CSDN特邀作者、博客专家、CSDN新星计…

echarts学习总结

一、新建一个简单的Echarts 首先新建一个vue2的项目,项目中安装Echarts cnpm install echarts --save1、title标题组件,包含主标题和副标题。 2、tooltip提示框组件 3、 legend图例组件 4、 series

算法通过村第九关-二分(中序遍历)黄金笔记|二叉搜索树

文章目录 前言1. 有序数组转二叉搜索树2. 寻找连个正序数组的中位数总结 前言 提示:有时候,我感觉自己一辈子活在两个闹钟之间,早上的第一次闹钟,以及5分钟之后的第二次闹钟。 --奥利弗萨克斯《意识的河流》 每个专题都有简单题&a…

新能源汽车OBC车载充电机(实物拆解)

需要样件请联:shbinzer 拆车邦 车载OBC简介 从产品/系统角度看OBC及在新能源汽车的作用。如下图,是威迈斯的OBC车载充电机,威迈斯今年刚上市,是OBC和DC/DC的领先企业。 图片来源:威迈斯官网(OBC) …

【简单图论】CF898 div4 H

Problem - H - Codeforces 题意&#xff1a; 思路&#xff1a; 手玩一下样例就能发现简单结论&#xff1a; v 离它所在的树枝的根的距离 < m 离这个根的距离时是 YES 否则就是NO 实现就很简单&#xff0c;先去树上找环&#xff0c;然后找出这个根&#xff0c;分别给a 和…

视频监控系统/视频汇聚平台EasyCVR有下级平台注册时出现断流情况该如何排查解决?

视频汇聚/视频云存储/集中存储/视频监控管理平台EasyCVR能在复杂的网络环境中&#xff0c;将分散的各类视频资源进行统一汇聚、整合、集中管理&#xff0c;实现视频资源的鉴权管理、按需调阅、全网分发、云存储、智能分析等&#xff0c;视频智能分析平台EasyCVR融合性强、开放度…

手把手教你制作登录、注册界面 SpringBoot+Vue.js(cookie的灵活运用,验证码功能)

一、用户登录界面 实现思路&#xff1a;用户在界面输入用户名和密码传入变量。用post方法传输到后端&#xff0c;后端接收整个实体对象。将用户名提取出。在dao层方法中通过select注解查询&#xff0c;返回数据库对应的数据对象。如果返回为空则return false。不为空则通过比对…

Mock快速入门使用及组件构造首页

一.什么是Mock.js Mock.js&#xff08;也称为 Mockjs 或 Mock.js&#xff09;是一个用于前端开发的模拟数据生成和接口模拟工具。它的主要作用是帮助前端开发人员在开发过程中模拟后端 API 的响应数据&#xff0c;以便进行测试和开发&#xff0c;而无需实际后端服务器支持。 模…

进灰的iPhone是印度组装?且慢嘲讽,这是中国制造!

苹果的iPhone15Pro max被拆机发现镜头出现灰尘&#xff0c;一些人士第一时间就说是印度制造&#xff0c;然而这些拆机博主晒出的图片显示却是中国制造&#xff0c;显然这与一些人士的预期有所不同&#xff0c;导致如此结果可能与iPhone的组装工期太紧张有关。 苹果的iPhone15生…

力扣刷题-链表-删除链表的倒数第N个节点

19.删除链表的倒数第N个节点 给你一个链表&#xff0c;删除链表的倒数第 n 个结点&#xff0c;并且返回链表的头结点。 示例 1&#xff1a; 输入&#xff1a;head [1,2,3,4,5], n 2 输出&#xff1a;[1,2,3,5] 示例 2&#xff1a;输入&#xff1a;head [1], n 1 输出&…

网络安全自学入门:(超详细)从入门到精通学习路线规划,学完即可就业

很多人上来就说想学习黑客&#xff0c;但是连方向都没搞清楚就开始学习&#xff0c;最终也只是会无疾而终&#xff01;黑客是一个大的概念&#xff0c;里面包含了许多方向&#xff0c;不同的方向需要学习的内容也不一样。 算上从学校开始学习&#xff0c;已经在网安这条路上走…

软件设计模式系列之十五——职责链模式

1 模式的定义 职责链模式&#xff08;Chain of Responsibility Pattern&#xff09;也称为责任链模式&#xff0c;是一种结构型设计模式&#xff0c;用于构建一条对象处理请求的责任链。在这个模式中&#xff0c;多个对象依次处理请求&#xff0c;直到其中一个对象能够处理该请…

Linux系统编程(五):信号

参考引用 UNIX 环境高级编程 (第3版)黑马程序员-Linux 系统编程 1. 信号基础理论 1.1 概念和机制 概念 信号在生活中随处可见&#xff0c;如&#xff1a;古代战争中摔杯为号、现代战争中的信号弹、体育比赛中使用的信号枪他们都有共性&#xff1a;简单、不能携带大量信息、满足…

你是怎么理解自动化测试的?理解自动化测试的目的和本质

其实自动化测试很好理解&#xff0c;由两部分组成&#xff0c;“自动化”和“测试”&#xff0c;所以我们要理解自动化测试&#xff0c;就必须理解“自动化”和“测试”&#xff0c;只有理解了这些概念&#xff0c;才能更轻松的做好的自动化测试。其中“自动化”可以想象成通过…