vue-admin-template 右上角的logo图片怎么换成用户自己的头像呢

最新推荐文章于 2024-08-30 10:45:30 发布
最新推荐文章于 2024-08-30 10:45:30 发布
阅读量1.2k 收藏
点赞数
文章标签： java vue.js elementui 前端框架
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zjp1310343359/article/details/129651046
版权

在这里插入图片描述
网上查到说好像是在这里改，我自己是用nginx配置把文件上传到本地文件夹下的
在这里插入图片描述
然后的话可以在修改界面上获取到用户自己的个人信息像这样：
在这里插入图片描述
数据库里的图片的存储信息是这样的在这里插入图片描述
请教一下如何把用户的头像替换掉右上角logo处的图片呢

好菜的大学生
关注
vue3-admin商品管理后台项目(后台布局layout布局开发一)
lovestar墨竹的博客
10-20 4405
vue3-admin商品管理后台项目(后台布局layout布局开发一)
一篇文带你使用vue完成一个完整后台
m0_67393295的博客
03-09 1839
介绍 vue-element-admin 是一个后台前端解决方案，它基于 vue 和 element-ui实现。它使用了最新的前端技术栈，内置了 i18 国际化解决方案，动态路由，权限验证，提炼了典型的业务模型，提供了丰富的功能组件，它可以帮助你快速搭建企业级中后台产品原型。相信不管你的需求是什么，本项目都能帮助到你 vue-element-admin定位是后台集成方案，不适合当基础模板进行二次开发，项目集成了许多用不到的功能，会造成代码沉余 vue-admin-template是一个后台基础模板，建议使
vue-admin-template之右上角logo换成自定义照片
YGGZZZ的博客
07-10 277
vue-admin-template之右上角logo换成自定义照片
vue 更改头像功能实现
06-21
vue 更改头像功能实现的代码，一个简单的HTML文件，直接引用vue文件进行编写
vue-admin-template右上角头像及退出功能部分更改
最新发布
laosao_66的博客
08-30 364
右上角部分的代码在这个文件中：~\src\layout\components\Navbar.vue ，可以在下面这段代码里修改右上角退出及跳转的功能以及链接。可以看到上面的代码里有头像的来源，我们需要做的就是在这个路径的文件~\src\store\modules\user.js中给avatar设置默认照片地址，
vue项目问题
weixin_48210599的博客
08-23 213
vue路由传值 vue的路由传值有两种方式 params this.$router.push({ path:"/地址", params:{ 参数名:"参数值" } }) 接受 this.$route.params."参数值" params的话传参刷新页面数据会消失不会保存 query this.$router.push({ path:"/地址", params:{ 参数名:"参数值" } }) 接受 this.$route.query."参数值" query的话
去除/更换vue-admin-template右上角logo
qq_43499191的博客
01-08 3327
方法： 菜单栏内容找到并替换/删除即可 logo也可以替换/删除
vue-admin-template中左上角logo让其显示、修改为自定义图片
CSDN_XHC的博客
05-07 4872
目录显示logo修改logo 显示logo 1. 找到settings.js文件，找到sidebarLogo(侧边栏logo) 2. 修改sidebarLogo的值为true 修改logo 1. 找到src/layout/components/Sidebar目录下的Logo.vue 2. 在logo那里填写自己的图片路径 3. 在Logo.vue中您不仅可以修改图片路径，还可以修改相关样式，让自己的样式更漂亮 ...
vue-element-admin框架修改为自己使用
weixin_49463158的博客
05-17 3772
简单记录一下这个框架的使用，把接口修改为自己的项目的过程 1、项目初始化（精简项目）首先吧views下除了 以外的页面全部删除（后续看情况自己手动添加） 2、删除路由 把constantRoutes 下的路由删除到只剩下 再把asyncRoutes下删除到只剩下 其实error也可以删除 3、删除src/router/modules文件夹 4、删除src/vendor文件夹 5、删除接口无关信息 删除mian.js里 然后在 6、修改你的域名 这是开发模式 这是打包模式 7、修改请求接口 一般只需
【Vue】项目：尚品汇后台管理系统(上)
weixin_44337386的博客
03-31 5403
记录尚品汇后台管理系统的开发过程，功能模块包括登录、首页、品牌管理、平台属性管理、SKU管理、SPU管理、用户管理、角色管理、菜单管理模块。后台管理系统是CMS内容管理系统的一个子集，通过项目实战可以彻底搞明白菜单权限、按钮权限如何实现，掌握市场中数据可视化ECharts、V-charts的运用。
vue-element-admin 侧边栏使用自己的图标
weixin_44896595的博客
10-15 1680
1、将你自己的svg文件放入，我这里的是src/icons/svg 2、直接打开，删除关于fill的一串代码，即可跟随变色
【前后台】后台管理系统技术栈vue-element-admin+服务端用egg实现上传头像功能
你若盛开，清风自来
04-03 1883
公认默认头像： https://cube.elemecdn.com/9/c2/f0ee8a3c7c9638a54940382568c9dpng.png 当一个新用户登录进来之后 是有如上默认头像的 当我们点击修改个人信息里面的头像时 可以重新上传自己的头像 而且和主页面是实时更新的 实现代码如下： 使用三元运算符进行判断 如果是新用户刚进来，则是默认头像 https://cube.ele...
Vue+element ui+springboot实现用户头像修改
m0_49647974的博客
11-08 9625
Vue+element ui+springboot实现用户头像修改 文章目录Vue+element ui+springboot实现用户头像修改头像上传后台接收前台读取并展示 头像上传 前台上传文件可以直接用elemen ui的上传组件 <el-upload class="avatar-uploader" action="http://localhost:8080/Login/upload"//上传的地址，即是后台保存文件的接口
用vue和Element实现更换头像的两种方式
weixin_45979310的博客
08-13 1777
方式一： 代码如下： <el-upload class="avatar-uploader" action="" :show-file-list="false" :http-request="submitUpload" :before-upload="beforeAvatarUpload"> <el-avatar v-if="imageUrl" :src="imageUrl" class="avatar"></el-avatar>
vue-admin-template开发（头像上传功能）
黑马Jack的博客
05-19 3066
vue-admin-template开发（头像上传功能） vue-admin-template是一个后台管理系统的前端框架，提供了登录、导航栏、路由等功能，是一个强大简洁的后台管理系统的前端框架。本文将讲述在 vue-admin-template 的基础上进行二次开发，把 vue-element-admin当做工具箱。 锁定头像上传功能 我们以vue-element-admin的头像上传为例，简单描述如何将头像上传功能移植进入到vue-admin-template中 锁定头像上传功能代码 首先在浏览器导
vue-admin 通过VUEX实时更新头像功能实现
yehaocheng520的博客
12-18 3445
vue-admin是一套基于vue+elementUi的后台管理系统框架，对前端来说真的非常友好，对一些想要搭建后台管理系统的后端同事也是一个很好的框架，实用性很高。 近期，我们公司正在做商户平台，根据商家Logo的图片上传，右上角的图标也要实时更新。 首先找到这个文件 src/layout/components/Navbar.vue <div class="avatar-wrapper"> <img :src="avatar? avatar + '?imageView2/1/w.
vue修改标签页logo图片
吃醋不爱蘸饺子的胡诌乱造
04-30 2996
vue修改标签页logo图片 由于vue2和vue3的项目结构不同，所以修改方式不一样。 1.vue2 首先static文件夹下放入ico图标 然后修改webpack.dev.conf.js文件 new HtmlWebpackPlugin({ filename: 'index.html', template: 'index.html', favicon:'./static/favicon.ico', inject: true }), 2.vue3 直接修改public文件夹下的ico图标
vue-admin-template的坑
klz
05-10 916
怎么回事！！！
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值