开始Flask项目
- 新建Flask项目。
- 设置调试模式。
- 理解Flask项目主程序。
- 使用装饰器，设置路径与函数之间的关系。
- 使用Flask中render_template，用不同的路径，返回首页、登录员、注册页。
- 用视图函数反转得到URL，{{url_for(‘login’)}}，完成导航条里的链接。
from flask import Flask from flask import render_template app = Flask(__name__) @app.route('/') def index(): return render_template('index.html') @app.route('/wr') def wr(): return render_template('wr.html') @app.route('/login') def login(): return render_template('login.html')if __name__ == '__main__': app.run(debug=True)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>首页</title> </head> <body> <li><a href="{{ url_for('index') }}"></a></li> <li><a href="{{ url_for('login') }}">登陆</a></li> <li><a href="{{ url_for('wr') }}">注册</a></li> </body> </html>
登陆
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" type="text/css" href="../static/css/aa.css"> <script src="../static/js/aa.js"></script> </head> <body> <div class="Outbox"> <div class="box"> <h2>Welcome to GZCC！</h2> <h3>登录页面</h3> <div class="input_box"> 账号：<input id="umane"type="text"placeholder="请输入账号"> </div> <div class="input_box"> 密码：<input id="upass"type="password"placeholder="请输入密码"> </div> <div id="error_box"><br></div> <div class="input_box"> <button onclick="myLogin()">登录</button> <button onclick=window.alert("请重新输入")>取消</button></div> </div> </div> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>界面</title>
<link rel="stylesheet" type="text/css" href="../static/css/aa.css">
<script src="../static/js/aa.js"></script>
</head> <div class="div1"> <div class="div2">注册</div>
<div class="div3"> 请输入你的昵称：<input id="username" type="text" placeholder="请输入你的昵称"> </div>
<div class="div3"> 设置密码：<input id="userpass" type="text" placeholder="请输入密码"> </div>
<div class="div3"> 重复密码：<input id="userpass1" type="text" placeholder="请再次输入密码"> </div>
<div id="error_box"><br></div> <div class="div3"> <button onclick="myLogin()">注册</button>
</div>
</div>
<br>
</body>
</html>
