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]
相关推荐
呱牛do it13 小时前
企业级门户网站设计与实现:基于SpringBoot + Vue3的全栈解决方案(Day 5)
java·vue
毕胜客源码15 小时前
卷积神经网络的农作物识别系统(有技术文档)深度学习 图像识别 卷积神经网络 Django python 人工智能
人工智能·python·深度学习·cnn·django
无心使然云中漫步15 小时前
Openlayers调用ArcGis地图服务之一 —— 地图切片(/tile)
前端·arcgis·vue·数据可视化
ch_atu16 小时前
序列化器的使用
django
Python私教17 小时前
我在开发 ShadcnVueAdmin 时发现了一个 Claude Code 超级插件
vue
计算机徐师兄21 小时前
Python基于Django的创新实验室系统(附源码,文档说明)
python·django·创新实验室系统·python创新实验室系统·创新实验室·实验室系统·python实验室系统
源码之家1 天前
计算机毕业设计:Python股票智能分析预测平台 Flask框架 数据分析 可视化 机器学习 随机森林 大数据(建议收藏)✅
python·机器学习·数据分析·django·flask·课程设计
B站_计算机毕业设计之家1 天前
计算机毕业设计:Python股票投资辅助决策系统 django框架 request爬虫 协同过滤算法 数据分析 可视化 大数据 大模型(建议收藏)✅
爬虫·python·深度学习·算法·django·flask·课程设计
无心使然云中漫步1 天前
Openlayers调用ArcGis地图服务之三 —— 要素查询(/query)
前端·arcgis·vue·数据可视化
呱牛do it1 天前
企业级门户网站设计与实现:基于SpringBoot + Vue3的全栈解决方案(Day 3)
java·vue