Django/React应用程序：如何在我的web应用程序中兼容Django URL（用于api发送数据）和React URL（用于呈现我的组件）
回答此问题可获得 20 贡献值，回答如果被采纳可获得 50 分。
<p>我刚刚在这个stackoverflow帖子之后，将它添加到我的react文件夹：<code>re_path(r'^(?:.*)/?$', views.index),</code>中的url.py中：<a href="https://stackoverflow.com/questions/40826295/react-routing-and-django-url-conflict">react routing and django url conflict</a>。我在开发工具中的错误是：未知的URL方案</p>
<p><strong>然而，</strong>在我的情况下，这会产生问题。我将JSON发送到react的方法是通过url:<code>"api/leads,"</code>，该url现在不可访问。我如何为我的react URL提供一种与django URL和谐共存的方式？附件是我的<code>django urls.py, react--> App.js, urls.py, views.py, index.html, and DataFetching.py</code>（在这里您可以看到我如何从api发送数据）</p>
<p><strong>Django:url.py</strong></p>
<pre><code>from django.urls import path
from . import views
urlpatterns = [
path('api/lead/', views.LeadListCreate.as_view()),
]
</code></pre>
<p><strong>Django项目：url.py</strong></p>
<pre><code>from django.contrib import admin
from django.urls import path, include, re_path
urlpatterns = [
path('admin/', admin.site.urls),
path('', include('leads.urls')),
path('', include('frontend.urls')),
]
</code></pre>
<p><strong>反应-->；url.py</strong></p>
<pre><code>from django.urls import path, re_path
from . import views
urlpatterns = [
#path('', views.index),
re_path(r'^(?:.*)/?$', views.index),
]
</code></pre>
<p>顺便说一句，我试图查看URL的文档（r^…），它没有告诉我如何导入它，而是说URL基本上与re_path相同；这可能是问题所在，但我仍然不知道解决办法</p>
<p><strong>反应-->；views.py</strong></p>
<pre><code>from django.shortcuts import render
def index(request):
return render(request, 'frontend/index.html')
</code></pre>
<p><strong>反应-->；App.js</strong></p>
<pre><code>import './index.css';
import BellIcon from './icons/bell.svg';
import MessengerIcon from './icons/messenger.svg';
import CaretIcon from './icons/caret.svg';
import PlusIcon from './icons/plus.svg';
import DataFetching from "../DataFetching";
import DropdownMenu from "../DropDown";
import React, { useState } from 'react';
import {
BrowserRouter as Router,
Switch,
Route,
Link
} from "react-router-dom";
function App() {
return (
<Router>
<div className="App">
<Navbar>
<NavItem icon={<PlusIcon />} />
<NavItem icon={<BellIcon />} />
<NavItem icon={<MessengerIcon />} />
<NavItem icon={<CaretIcon />}>
<h1> Hello World </h1>
<DropdownMenu></DropdownMenu>
</NavItem>
</Navbar>
<Switch>
<Route path="/about">
<About />
<DataFetching />
</Route>
<Route path="/users">
<Users />
</Route>
<Route path="/">
<Home />
</Route>
</Switch>
</div>
</Router>
);
}
function Home() {
return <h2>Home</h2>;
}
function About() {
return <h2>About</h2>;
}
function Users() {
return <h2>Users</h2>;
}
</code></pre>
<p>（还有更多，但并不相关）</p>
<p><strong>DataFetching.js</strong></p>
<pre><code>import React, {useState, useEffect} from 'react'
import axios from 'axios'
function DataFetching() {
const [leads, setLeads] = useState([])
useEffect(() => {
axios.get("api/lead")
.then(res =>{
console.log(res)
setLeads(res.data)
})
.catch(err => {
console.log(err)
})
}, [])
return (
<div>
<ul>
{
leads.map(lead => <li key={lead.id}>{lead.name} says {lead.message}</li>)
}
</ul>
</div>
)
}
export default DataFetching
</code></pre>
<p><strong>index.html</strong></p>
<pre><code><!DOCTYPE html>
<html>
<head>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700;900&display=swap" rel="stylesheet">
<title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root">
<!-- React will load here -->
</div>
{% load static %}
<script src="{% static "frontend/main.js" %}"></script>
</body>
</html>
</code></pre>
<p>如果您有更好的方法将数据发送到我的react应用程序或其他有用的见解，请随时加入聊天</p>
<p>编辑进度：无，仍然没有关于这个问题从何处开始的线索，在这个主题上找不到任何有意义的东西</p>
请先 登录 后评论
针对此问题: 更多的回答
- 89 关注
- 1 收藏，216 浏览
- 网友 提问于 2天前
相关Python问题
- 当用户用PYTHON设置一个或一个不带值的URL时，他们怎么能输入一个/a的代码呢？ 10 回答
- 当用户登录到站点时，如何显示不同的导航栏 4 回答
- 当用户登录时，在Flask中向用户显示处理结果 3 回答
- 当用户的Flask会话结束时，我如何从Redis后端中移除所有Celery结果？ 8 回答
- 当用户的Okta配置文件字段当前为blan时，更新该字段 10 回答
- 当用户的付款逾期2天时，从Django模型检索数据 2 回答
- 当用户的消息以问号结尾时，如何让机器人说些什么？ 7 回答
- 当用户的系统上可能也安装了Python 2.7时，如何在用户的系统上运行Python 3脚本？ 7 回答
- 当用户确定打印数量时，使用Matplotlib打印动画 10 回答
- 当用户离开时是否可以删除整个网页？ 9 回答
- 当用户给出一个单词时如何打印？ 9 回答
- 当用户继续更改TKin中的值（使用trace方法）时，使用Entry并更新输入的条目 5 回答
- 当用户编辑表单字段时，从Django时间字段中删除秒数 7 回答
- 当用户被更改时，消息不会来自web套接字 8 回答
- 当用户访问表单时，如何使表单为只读，而不具有更改权限 6 回答
- 当用户试图更改对象的值时，使用描述符类引发RuntimeError 8 回答
- 当用户调整GUI的大小时，是否有方法更改GUI内容的大小？ 9 回答
- 当用户调整风的大小时，pythontkinter小部件的大小会不均匀 7 回答
- 当用户购买某个类别时，是否查找其他类别的销售？ 5 回答
- 当用户转到上一页时，Django和芹菜插入操作 7 回答
