我有一个用Python/Django作为后端和React作为前端的小项目。我遵循了这个教程的指导:http://geezhawk.github.io/using-react-with-django-rest-framework
我想展示项目的标志性图片,webpack构建成功了,但是当我查看页面时,图片无法加载。我认为这是因为图像的已编译URL无法从Django的URL解析,并且访问该URL只会加载相同的索引页面...
此时我不确定该如何解决,但如果有人能指向一个示例代码来演示如何在React + Django项目中加载图片,我将不胜感激。
编辑
项目结构
project
|- api
| |- models.py
| |- serializers.py
| |- views.py
|- assets
| |- bundles
| |- js
|- node_modules
|- project
| |- settings.py
| |- static
| |- urls.py
|- templates
| |- index.html
在urls.py文件中
url(r'^$', TemplateView.as_view(template_name='index.html'))
这是我的index.html文件
{% load render_bundle from webpack_loader %}
<!DOCTYPE html>
<html>
<head>
<title>Hello React</title>
</head>
<body>
<div id="content"></div>
{% render_bundle 'main' %}
</body>
</html>
这里是我尝试在我的JS中加载图片的位置
import React from 'react'
import logo from './resources/logo.jpeg'
class Header extends React.Component {
render() {
return (
<nav className="navbar navbar-expand-md fixed top bg-dark navbar-dark">
<a className="navbar-brand" href="#">
<img src={logo} width="30" height="30" className="d-inline-block align-top" alt="" />
Project Name
</a>
</nav>
)
}
}