Vue项目添加动态浏览器头部标题的方法

0.直接上预览链接效果图

某视频剪辑软件项目添加动态浏览器头部标题

1.实现思路

(1 ) 从路由路由器里面得到组件的标题

(2)标题存vuex(本项目已经封装h5的本地存储和localStorage也可以存在这里面)

(3 ) 设置标题

(1)从路由路由器里面得到组件的标题

在router.beforeEach((to，from，next)={}里面

const browserHeaderTitle=to。名称(2)标题存状态管理

SET _ BROWSERHEADERTITLE:(状态，动作)={ state。BROWERHADERTITLE=action。BROWERHADERTITLE }商店。提交(' SET _ BROWERHADERTITLE '，{ browerhaderttle : browerhaderttle })(3)设置标题

我们在路由在.之后后设置标题

/** * 设置浏览器头部标题*/export const setTitle=function(title){ title=title？`$ { title } ` : ' NxAdmin '窗口。文件。title=title }路由器。在每个(()={ nProgress)之后。done()//结束progress setTimeout(()={ const browseradertitle=store。吸气剂。browseradertitle setTitle(browseradertitle)}，0)})源码地址

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。