vued中图片路径与主机路径相关联,例如img:‘http://127.0.0.1:8000/media/data/els.jpg‘

1.在Django项目的settings.py文件中,确保已指定正确的MEDIA_URLMEDIA_ROOTMEDIA_URL定义了图片的URL前缀,MEDIA_ROOT定义了本地文件系统中存储图片的路径。

2.在 Django 项目的主 urls.py 文件中,确保包含了适当的 URL 配置,以便将媒体文件服务到 MEDIA_URL 路径下的 URL。

python 复制代码
from django.views.static import serve
from django.urls import path, re_path, include
from django.conf import settings

#设置静态路径访问接口
 re_path(r'^media/(?P<path>.*)$', serve, {
     'document_root': settings.MEDIA_ROOT
     }),                                     # 静态资源访问接口

3.vue使用

javascript 复制代码
<img :src="imgurl" alt="Image">

this.imgurl = 'http://localhost:8000/media/res/file/' + this.imgurls[this.currentIndex]
相关推荐
集成显卡2 分钟前
前端视频播放方案选型:主流 Web 播放器对比 + Vue3 实战
前端·vue·音视频
克里斯蒂亚诺·罗纳尔达9 分钟前
vue页面加载时间过长优化
vue
墨染青竹梦悠然1 小时前
基于SpringBoot + vue的农产品销售系统(华夏鲜仓)
vue.js·spring boot·python·django·毕业设计·毕设
wanderful_1 小时前
自定义用户体系下 Django 业务模块开发踩坑与通用解决方案(技术分享版)
后端·python·django
草根大哥2 小时前
AI编程实践-homex物业管理平台(Go + Vue3 + MySQL 多租户落地)
mysql·golang·vue·ai编程·gin·物业管理系统·多租户
H Journey2 小时前
Django 教程
数据库·django·sqlite
墨染青竹梦悠然2 小时前
基于Django+vue的单词学习平台
前端·vue.js·后端·python·django·毕业设计·毕设
YJlio11 小时前
1.7 通过 Sysinternals Live 在线运行工具:不下载也能用的“云端工具箱”
c语言·网络·python·数码相机·ios·django·iphone
YJlio1 天前
1.6 使用 Streams 工具移除下载文件的 ADS 信息:把“来自互联网”的小尾巴剪掉
c语言·网络·python·数码相机·ios·django·iphone
B站_计算机毕业设计之家1 天前
电影市场预测分析系统 | Python Django Echarts 票房可视化分析 大数据 人工智能 毕业设计源码(建议收藏)✅
大数据·数据库·python·机器学习·django·毕业设计·echarts