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]
相关推荐
Sheffield3 小时前
为什么Django这么慢,却还是Python后端第一梯队呢?
linux·python·django
海兰4 小时前
Elasticsearch 搜索方案与技术栈深度解析
大数据·elasticsearch·django
是梦终空13 小时前
计算机毕业设计266—基于Springboot+Vue3的共享单车管理系统(源代码+数据库)
数据库·spring boot·vue·课程设计·计算机毕业设计·源代码·共享单车系统
yixin1231 天前
【玩转全栈】----Django基本配置和介绍
数据库·django·sqlite
是梦终空1 天前
计算机毕业设计267—基于Springboot+vue3+小程序的医院挂号系统(源代码+数据库)
spring boot·小程序·vue·毕业设计·课程设计·医院挂号系统·源代码
luoluoal1 天前
基于python的医疗知识图谱问答系统(源码+文档)
python·mysql·django·毕业设计·源码
云游云记1 天前
vue2 vue3 uniapp (微信小程序) v-model双向绑定
微信小程序·uni-app·vue
yueyin1234561 天前
在Django中安装、配置、使用CKEditor5,并将CKEditor5录入的文章展现出来,实现一个简单博客网站的功能
数据库·django·sqlite
沐墨染2 天前
黑词分析与可疑对话挖掘组件的设计与实现
前端·elementui·数据挖掘·数据分析·vue·visual studio code
集成显卡2 天前
前端视频播放方案选型:主流 Web 播放器对比 + Vue3 实战
前端·vue·音视频