我们如何将数据从Django发送到React？_django如何将pdf传输到react前端-CSDN博客

本文链接：https://blog.csdn.net/keny88888/article/details/128519583

本文介绍了如何使用Django创建后端服务，并与React前端进行集成。首先，详细阐述了Django的安装、项目创建和环境配置，包括安装Python、创建Django项目和应用程序，以及设置数据库模型。接着，讲解了如何通过Django REST框架创建API，并通过超级用户管理数据。最后，讨论了如何在React中创建前端组件，实现CRUD操作，完成前后端的交互。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

4.2.1python manage.py migrate

4.2.2 python manage.py makemigrations

5.添加超级用户

5.1 在django_react_proj里面修改urls.py

5.2 运行服务

5.3 输入一个Students的基本信息

6.浏览器查看

7.建立前端

7.1 react 前端

7.2 CRUD React组件处理header组件

7.3 界面编辑

7.4 结构

总结

前言

可以使用Django以不同的方式公开API。您可以使用REST API、GraphQL API或RPC API，各有利弊。虽然GraphQL是一个安全的选择，但我们将使用传统的REST端点。

一、Django是什么？

Django是一个开放源代码的Web应用框架，由Python写成。采用了MTV的框架模式，即模型M，视图V和模版T。它最初是被开发来用于管理劳伦斯出版集团旗下的一些以新闻内容为主的网站的，即是CMS（内容管理系统）软件

二、使用步骤

1.安装

必须要安装python

pip install django

1.1安装条件

Python 3

Pip（默认Python包安装程序）

NodeJS（版本6或更高版本）和npm（5.2+）

2.建立项目

通过PycharmCE建立项目，项目命名为DjangoReact

2.1项目的环境

项目建立后，通过pip list查看基本环境

可以看出需要升级pip ，升级到pip-22.3.1

Looking in indexes: https://pypi.tuna.tsinghua.edu.cn/simple
Requirement already satisfied: pip in ./venv/lib/python3.9/site-packages (21.1.2)
Collecting pip
  Using cached https://pypi.tuna.tsinghua.edu.cn/packages/09/bd/2410905c76ee14c62baf69e3f4aa780226c1bbfc9485731ad018e35b0cb5/pip-22.3.1-py3-none-any.whl (2.1 MB)
Installing collected packages: pip
  Attempting uninstall: pip
    Found existing installation: pip 21.1.2
    Uninstalling pip-21.1.2:
      Successfully uninstalled pip-21.1.2
Successfully installed pip-22.3.1

2.2 安装django和需要软件

pip install django djangorestframework django-cors-headers

安装记录为通过清华镜像会比较快

 pip install django djangorestframework django-cors-headers
Looking in indexes: https://pypi.tuna.tsinghua.edu.cn/simple
Collecting django
  Using cached https://pypi.tuna.tsinghua.edu.cn/packages/21/26/28895838228c46ece278d764720995d5a51e4bce7d02d2a54e70f59108e1/Django-4.1.4-py3-none-any.whl (8.1 MB)
Collecting djangorestframework
  Downloading https://pypi.tuna.tsinghua.edu.cn/packages/ff/4b/3b46c0914ba4b7546a758c35fdfa8e7f017fcbe7f23c878239e93623337a/djangorestframework-3.14.0-py3-none-any.whl (1.1 MB)
     ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 1.1/1.1 MB 3.1 MB/s eta 0:00:00
Collecting django-cors-headers
  Downloading https://pypi.tuna.tsinghua.edu.cn/packages/db/e2/912cdc408f7ddc07967e94c3d785389c36fbfdcb48755393fbf65a02aabf/django_cors_hea