vue-element-admin项目怎么修改title

最新推荐文章于 2023-07-25 09:16:07 发布

维他命啊

最新推荐文章于 2023-07-25 09:16:07 发布

阅读量1.8k

点赞数 2

分类专栏： vue-element-admin 文章标签： vue.js github 前端

本文链接：https://blog.youkuaiyun.com/weitaminga/article/details/121083670

版权

vue-element-admin 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了如何在vue-element-admin项目中修改title。首先从官网下载项目并重命名，然后在permission.js中找到设置title的代码，通过utils的getPageTitle方法修改title。同时，别忘了在settings.js和vue.config.js中更新项目名称和title。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、首先在官网：https://panjiachen.github.io/vue-element-admin-site/zh/guide/essentials/layout.html#layout

官网有说明，拉取项目：

https://github.com/PanJiaChen/vue-element-admin.git

下载完成后，项目是vue-element-admin-master，我们可以修改项目名，改成自己的。

二、接下来就是修改项目里的title了：

1.找到permission.js页面
其中document.title = getPageTitle(to.meta.title)就是设置title

2.在utils找到getPageTitle方法,引号里面写入title。

3.再找到settings.js

当然，如果你把项目名字改为自己的，也需要在vue.config.js修改title。

登录页面左边的标题：

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

维他命啊

关注关注

2
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

Vue和Vue-Element-Admin（四）：vue-element-admin的用户登录集成

叶子叶来

11-20

1万+

Vue-element-admin使用mock.js数据进行用户和权限的验证，使用该框架开发的首要事情就是用户集成改造，使用本地测试环境的用户和角色信息完成登录验证；github地址：https://github.com/yezonggang/testspring

Vue和Vue-Element-Admin（二）：vue-element-admin的目录结构和使用

叶子叶来

11-20

8095

Vue-Element-Admins是前端成熟框架，基于vue+element ui的开源技术方案：vue-element-admin 码云地址，教程：vue-element-admin教程，界面简洁清爽；本地安装node.js和git工具，copy到本地即可运行，框架默认使用mock数据 # 克隆项目 git clone https://github.com/PanJiaChen/vue-element-admin.git # 进入项目目录 cd vue-element-admin # 安..

参与评论您还未登录，请先登录后发表或查看评论

vue-element-admin更改网页标题和图标

最新发布

zmy9forever的博客

07-25

1979

这句话中的defaultSettings是从settings文件导入的，然后选中defaultSettings，再按F12键来到。页面中有句const title = defaultSettings.title || 'hello world'选中 getPageTitle 按F12键转到定义，来到了。看到下面的title，更改即可。这句话就是获取页面标题，

vue-element-admin修改浏览器中标题

Tatooine

09-15

667

@\src\utils\get-page-title.js: const title = defaultSettings.title || '新标题' @\src\settings.js: title: '新标题'

如何修改vue-admin-template，vue，electron-vue-admin的页面标题

yzx125的博客

09-12

1103

vue-admin-template:在setting.js中修改 vue项目中：在index.html中修改 electron-vue-admin中：在index.ejs中修改

vue-element-admin如何添加路由以及如何修改title

weixin_45973832的博客

02-28

1206

vue-element-admin如何添加路由以及如何修改title

vue-element-admin框架使用时如何更改各类title

weixin_49136697的博客

10-15

1272

1.登陆页面title 修改方法： src>views>login>index.vue 在此页面中更改如下 2.标签页名称修改方法： src>views>settings.js 3.侧边栏logo是否显示以及修改侧边栏title （1）logo显示修改方法： src>views>settings.js 将false修改为true （2）title 修改方法： src>layout>components>Sidebar>Logo.vue

vue-element-admin 菜单标签失效的解决方式

10-16

在Vue.js开发中，特别是使用基于Vue的框架如vue-element-admin时，可能会遇到菜单标签失效的问题。这种情况通常出现在用户在切换不同的路由时，菜单栏的选中状态没有正确地保持，或者页面之间的缓存处理不当导致。...

一二三应用开发平台——vue-element-plus-admin整合后端实战，实现系统登录、缓存用户数据、实现动态路由

热门推荐

学海无涯，行者无疆

03-27

2万+

整合vue-element-plus-admin前端框架，作为开发平台的前端。介绍如何对vue-element-plus-admin改造，实现系统登录、缓存用户数据以及动态路由。

vue-element-admin项目开发全流程

guanan1230的博客

05-16

1112

vue组件开发编写组件时应该先定义API props名称具备语义化，类型符合规范 props可以添加自定义校验validator，值是一个函数，参数是当前传入值，返回值是布尔值组件使用时绑定的类似于原生的事件，不能被识别，需要添加.native修饰符或者当成自定义事件处理 <template> <button class="h-btn" :class="[sizeClass,typeClass]" @click="clickHandler"> <

vue-element-admin 修改页面标题（title）

qq_45844443的博客

04-19

4377

vue-element-admin 修改页面标题（title）1.找到permission.js页面2.找到get-page-title.js3.再找到settings.js 1.找到permission.js页面其中document.title = getPageTitle(to.meta.title)就是设置title 然后找到getPageTitle方法,按住Ctrl键左键单击getPageTitle方法跳转到get-page-title.js文件界面 2.找到get-page-title.js

vue动态编辑网页title方法

Betrayer_hobby的博客

01-10

887

vue自定义title

修改Vue项目名称

我驾驶汽车从不是为了从A点到达B点，我喜欢去感受汽车，与之交流，与之融为一体。

10-03

1万+

1、创建一个新的项目文件夹，复制之前的项目文件夹里面除了node_modules文件夹以外的内容到新的项目文件夹 2、然后修改根目录下的package.json文件，把name修改成你的项目名称 3、修改根目录下面的index.html文件的title，改好之后，vue文件的title就改过来了 4、重新npm instrall一次，记得npm 之后，之前通过npm安装的插件，也要重新安...

vue-admin-element路由的meta中动态title设置，可以根据不同情况展示不同的内容，新增，修改同一个路由不同title显示实现

菜鸡进阶之路

01-13

4621

vue-admin-element动态去处理meta中的标题，新增和修改可以公用一个路由并且显示不同标题

vue-admin-template 常用配制修改

闲时不练功，忙时一场空

06-23

1755

1、修改应用的名称找到src目录下的settings.js配置文件，修改为如下所示 module.exports = { title: 'xxx管理系统', /** * @type {boolean} true | false * @description Whether fix the header */ fixedHeader: true, //固定头部 /** * @type {boolean} true | false * @descript

YDOOK: vue3: vue-cli4: 更换页面 ICON icon图标标志

YDOOK

02-13

1157

YDOOK: vue3: vue-cli4: 更换页面 ICON icon图标标志 © YDOOK JYLin 1. 将新 icon 文件拖入文件目录： ./public: 2. 新建或者在已有的 vue.config.js 文件根位置中输入： module.exports = { pwa: { iconPaths: { favicon32: 'ydook.ico', favicon16: 'ydook.ico',

vue项目设置浏览器标题title及图标

Aaron_杀死庸碌的博客

07-14

1万+

方法一：在vue.config.js文件，添加如下代码：方法二：直接在public/index.html中修改title即可，如下：二、动态设置标题方案方法一：通过路由导航守卫设置，使用Vue-Router的beforeEach拦截方法二：使用插件vue-wechat-title来设置浏览器动态标题三、图标修改 1、首先做一个ico的小图标，命名为 favicon.ico 放在 /public/下面，替换原有的 favicon.ico，需要可以备份原有的 favicon.ico。 2、在 /pub

前端 vue-element-admin、前端项目的创建和基本配置（四）

世上哪有什么岁月静好,不过是有人替你负重前行

02-10

8863

文章目录一、vue-element-admin二、vue-admin-template三、项目的创建和基本配置四、登录页修改五、页面零星修改六、Eslint语法规范型检查一、vue-element-admin 1、简介而vue-element-admin是基于element-ui 的一套后台管理系统集成方案。功能：https://panjiachen.github.io/vue-element-admin-site/zh/guide/#功能 GitHub地址：https://github.com/Pa

vue-element-admin修改浏览器的标题

weixin_44953664的博客

06-24

2245

点此进入

Vue-element-admin：基于element-ui的前端项目框架

但是，由于它是一个模板项目，有时候可能需要开发者根据实际需求进行适当的修改和扩展，这可能需要对 Vue.js 和 Element UI 有较深的理解。此外，由于是基于 Vue 2.0，可能在性能和新特性的支持上不如使用 Vue 3.0 ...