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]
相关推荐
椰果uu6 小时前
vue-virtual-scroller-虚拟滚动列表:渲染不定高度长列表+可控跳转
前端·javascript·typescript·vue
哈里谢顿6 小时前
django的db性能调优
django
小和尚敲木头7 小时前
记录一次vue3中this引发的开发没有问题,生产发生问题的分析
前端·vue
luoluoal9 小时前
基于python的二维码生成算法研究和实现(源码+文档)
python·mysql·django·毕业设计·源码
PieroPc9 小时前
用FastAPI 后端 和 Vue3 前端写一个博客系统 例
前端·vue·fastapi
有梦想的攻城狮10 小时前
Django使用介绍
后端·python·django
xj75730653311 小时前
《精通Django》 第三章 Django模板
数据库·django·sqlite
Web项目开发12 小时前
VitePress 创建技术文档
vue
电商API&Tina1 天前
京东 API 数据采集接口接入与行业分析
运维·服务器·网络·数据库·django·php
DXDZ20221 天前
12V大功率ESD产品TVS20H12T5G 5000W 200A VC24V助力快充接口浪涌防护
5g·django·symfony