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]
相关推荐
碎碎念_49215 小时前
前后端分离项目开发规范
nginx·vue·springboot·restful
不能只会打代码18 小时前
校享云 — 高校智慧后勤平台微服务架构设计与实践
spring cloud·docker·微服务·nacos·vue·校享云
是梦终空18 小时前
计算机毕业设计279—基于SpringBoot+Vue3校园商户意见反馈系统(源代码+数据库+17000字论文+ppt)
数据库·spring boot·vue·毕业设计·课程设计·毕业论文·源代码
yyt3630458412 天前
KlineChartQuant Tooltip 高频交互 200FPS 性能优化完整复盘
前端·经验分享·性能优化·typescript·vue·交互·chrome devtools
hanxiuchao2 天前
告别客户端臃肿!网页端 M3U8 播放调试方案,适配全办公场景
运维·python·django·m3u8·m3u8播放
程序员羽痕2 天前
基于深度学习的眼疾识别系统
人工智能·pytorch·深度学习·分类·django
这里是杨杨吖2 天前
SpringBoot+Vue心理健康咨询系统 附带详细运行指导视频
spring boot·vue·心理健康
流云鹤3 天前
1. 配置环境、创建导航栏
python·django
流云鹤3 天前
2.登录模块
python·django