Python flask+react+antd实现登陆demo

最新推荐文章于 2023-05-01 10:19:56 发布

weixin_30867015

最新推荐文章于 2023-05-01 10:19:56 发布

阅读量722

点赞数

文章标签： python javascript 数据库 ViewUI

原文链接：http://www.cnblogs.com/jlj9520/p/6625535.html

版权

本文介绍了如何使用Python的Flask框架与React的Ant Design库结合，创建一个本地化的登录页面。首先，将Antd本地化，然后在Flask的templates中使用Antd的表单组件渲染登录页面。在Login.js中完成表单验证，当后端Flask返回登录成功后，前端会自动跳转至登录后的页面。

摘要由CSDN通过智能技术生成

这两天在研究flask和antd，想把这俩个东西结合来使用，单独学antd的时候用的是dva来配置，但是发现这样与flask结合的话需要启动两个服务，作为flask只是作为数据的接口，并没用用到其强大的模板渲染功能，所以最后还是想能本地化antd，把它当做只是一个ui组件库来用的话可能就能实现了。下面是具体的流程。　　

在上一篇中写到了将antd本地化，在此基础上我们就可以用antd表单组件渲染一个登录页面，再将其放在flask的templates中。模板login.html:

<!DOCTYPE html>
<html>
  <head>
      <meta charset="UTF-8" />
      <title>欢迎登录!</title>
      <script src="/static/react/react.min.js"></script>
      <script src="/static/react/react-dom.min.js"></script>
      <script src="/static/react/browser.min.js"></script>
      <script src="/static/antd/dist/antd.js"></script>
      <link href="/static/antd/dist/antd.css" rel="stylesheet"/>
      <link href="/static/css/login.css" rel="stylesheet"/>
      <script src="/static/js/pagetools/jquery-1.11.3.min.js"></script>
  </head>
  <body