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]
相关推荐
工业互联网专业6 分钟前
基于协同过滤算法的小说推荐系统_django+spider
python·django·毕业设计·源码·课程设计·spider·协同过滤算法
Q_Q196328847531 分钟前
python+django/flask基于Echarts+Python的图书零售监测系统设计与实现(带大屏)
spring boot·python·django·flask·node.js·php
IT教程资源C38 分钟前
(N_151)基于微信小程序校园学生活动管理平台
mysql·vue·前后端分离·校园活动小程序·springboot校园活动
Q_Q5110082854 小时前
python+django/flask的莱元元电商数据分析系统_电商销量预测
spring boot·python·django·flask·node.js·php
大叔_爱编程5 小时前
基于Python的历届奥运会数据可视化分析系统-django+spider
python·django·毕业设计·源码·课程设计·spider·奥运会数据可视化
Q_Q19632884756 小时前
python+django/flask基于协同过滤算法的理财产品推荐系统
spring boot·python·django·flask·node.js·php
Q_Q196328847511 小时前
python+django/flask基于深度学习的个性化携程美食数据推荐系统
spring boot·python·深度学习·django·flask·node.js·php
Q_Q51100828512 小时前
python+django/flask的篮球馆/足球场地/运动场地预约系统
spring boot·python·django·flask·node.js·php
Q_Q51100828513 小时前
python+django/flask的城市供水管网爆管预警系统-数据可视化
spring boot·python·django·flask·node.js·php
AI3D_WebEngineer1 天前
企业级业务平台项目设计、架构、业务全解之组件库篇
前端·javascript·vue