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

1.在Django项目的settings.py文件中,确保已指定正确的MEDIA_URL和MEDIA_ROOT。MEDIA_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]
相关推荐
咚咚咚小柒1 小时前
【前端】LangChain.js学习
前端·javascript·人工智能·typescript·langchain·vue·ai编程
ycydynq6 小时前
django 添加信息时,对外键设置条件
数据库·python·django
智购科技无人售货机厂家7 小时前
自动售货机物联网平台为什么会出现在线状态不一致?~YH
python·单片机·嵌入式硬件·django·pygame
FYKJ_20101 天前
springboot高考志愿填报推荐系统14332-计算机课程设计、毕业设计
javascript·spring boot·python·架构·django·课程设计·高考
我的xiaodoujiao1 天前
Django 权限系统项目实战详细图文教程 3--系统登录功能实现
后端·python·django
我的xiaodoujiao1 天前
Django 权限系统项目实战详细图文教程 4--系统登录功能实现 2
后端·python·django
2501_944521592 天前
Immer 跨端三方库仓颉适配全流程
python·eclipse·django
悟道书生2 天前
若依 RBAC 权限控制学习笔记
java·网络·笔记·sql·学习·vue
mewowaBc2 天前
使用Pinia持久化存储实现用户认证系统
vue·pinia·用户认证系统
2501_948122632 天前
Qs 跨端三方库仓颉适配全流程
python·react native·django·tornado