当前位置: 首页 > Web前端 > CSS

Vue项目添加动态浏览器头部title

时间:2023-03-30 13:54:16 CSS

0。直接上传预览链接+渲染Vue项目添加动态浏览器头部title1.实现思路(1)从routing路由器中获取组件的标题(2)将标题保存在vuex中(本项目中已经封装了h5的sessionStorage和localStorage也可以存在于此)(3)设置标题(1)获取来自router.beforeEach((to,from,next)=>{}insideconstbrowserHeaderTitle=to.name(2)titlestorevuexSET_BROWSERHEADERTITLE:(state,action)=>{state.browserHeaderTitle=action.browserHeaderTitle}store.commit('SET_BROWSERHEADERTITLE',{browserHeaderTitle:browserHeaderTitleus})(路由后设置标题/***设置浏览器标题标题*/exportconstsetTitle=function(title){title=title?`${title}`:'NxAdmin'window.document.title=title}router.afterEach(()=>{NProgress.done()//结束进度setTimeout(()=>{constbrowserHeaderTitle=store.getters.browserHeaderTitlesetTitle(browserHeaderTitle)},0)})源码地址前端学习交流群493671066,美女多多。老司机连忙上车,来不及解释。笔者相关的Vue文章都是基于Vue2.0实现后台系统权限控制。前端文档总结