代码改变世界

开始Flask项目

2017-11-03 18:00  082何晓琳  阅读(181)  评论(0编辑  收藏  举报
  1. 新建Flask项目。
  2. 设置调试模式。
  3. 理解Flask项目主程序。
  4. 使用装饰器,设置路径与函数之间的关系。
  5. 使用Flask中render_template,用不同的路径,返回首页、登录员、注册页。
  6. 用视图函数反转得到URL,{{url_for(‘login’)}},完成导航条里的链接
    from flask import Flask,render_template
    
    app=Flask(__name__)
    
    @app.route('/')
    
    def base():
        return render_template('base.html')
    
    @app.route('/login/')
    def login():
        return render_template('denglu.html')
    
    @app.route('/signin/')
    def zhuce():
        return  render_template('zhuce.html')
    
    if __name__=='__main__':
        app.run(debug=True)
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>广州商学院</title>
    <nav>
        <img src="http://img.zcool.cn/community/019f9c5542b8fc0000019ae980d080.jpg@1280w_1l_2o_100sh.jpg" width="50"height="50">
        <a href="http://www.gzcc.cn/">首页</a>
        <a href="http://127.0.0.1:5000/login/">登录</a>
        <a href="http://127.0.0.1:5000/signin/">注册</a>
        <input type="text">
        <button>search</button>
    </nav>
       <link rel="stylesheet" type="text/css" href="../static/css/daohang.css">
    </head>
    <body>
    <h1 class="zao">广州商学院</h1>
    <h2 >2017</h2>
    <h3><span id="commentcount" >每天新鲜事</span></h3>
    
    <div id="2015"style="width: 400px">
        <div id="header"style="background-color: pink":><h2 align="center "style="margin-bottom: 0">登录</h2></div>
        <div id="content"style="background-color: palevioletred;height:150px;width: 400px;float: left">
            <from action="">
                Username:<input type="text"name="user"placeholder="用户名"><br>
                Passward:<input type="password"name="password"><br>
                <input type="radio"name="role"value="stu">student
                <input type="radio"name="role"value="tea">teacher<br>
    
                <input type="checkbox"value="true"><span>记住我</span><a href="">登录遇到的问题</a><br>
    
                <input type="button"value="login"onclick="alert('登录验证')">
            </from>
    </div>
        </div>
    <hr>
    <div>
    
        <select>
            <br><option>收藏</option>
           <br> <option>点赞</option>
           <br> <option>评论</option>
        </select>
        <hr><br>
       <br> <h3 id="学院介绍">学院介绍</h3>
        <d1>
            <br><dt><a href="http://site.gzcc.cn/">信息技术与工程学院</a> </dt>
          <br>   <dt><a href="http://st.gzcc.cn/">旅游学院</a> </dt>
            <br><dt><a href="http://sfl.gzcc.cn/">外国语学院</a></dt>
           <br> <dt><a href="http://sl.gzcc.cn/">法学院</a></dt>
    
    
        </d1>
        <hr><br>
    
    </div>
    
    
     <a href="http://www.gzcc.cn/" >友情链接:详情请进入广州商学院官网</a>
    
    </body>
    </html>
    <!DOCTYPE html>
    <html lang="en">
    <head>
    
        <meta charset="UTF-8">
        <title>注册</title>
        <link href="../static/css/zhuce.css" rel="stylesheet" type="text/css">
        <script src="../static/js/zhuce.js"></script>
    
    </head>
    
    <body>
    <div><h1>用户注册</h1></div>
      <div class="aa"><script>document.write("loading....")</script>
        </div>
    <div class="flex-container">
    
        <div class="box">
    <h2>欢迎加入</h2>
            <div class="input_box">
                请输入账号 <input id="uname" type="text"laceholder="请输入账号">   </div><br>
            <div class="input_box">
                请输入密码 <input id="upass" type="password" placeholder="请输入密码"></div><br>
             <div class="input_box">
                再输入密码 <input id="upass1" type="password" placeholder="再次输入密码"></div><br>
            <div id="error_box"><br></div>
             <div class="input_box">
                <button onclick="fnLogin()" >register</button></div>
        </div>
    </div>
    </body>
    </html>
    <!DOCTYPE html>
    <html lang="en">
    <head>
    
        <meta charset="UTF-8">
        <title>登录</title>
        <link href="../static/css/denglu.css" rel="stylesheet" type="text/css">
        <script src="../static/js/denglu.js"></script>
    
    </head>
    
    <body>
      <div><h1>用户登录</h1></div>
      <div class="aa"><script>document.write("loading....")</script>
        </div>
    
    <div class="flex-container">
    
        <div class="box">
            <p id="we">aaa</p>
            <script>
      document.getElementById("we").innerHTML=Date();
      <!--代替id=we的内容-->
    
            </script>
    
            <div class="input_box">
                登录 <input id="uname" type="text" placeholder="输入用户名">
            </div>
            <br>
            <div class="input_box">
                密码 <input id="upass" type="password" placeholder="输入密码">
            </div>
            <br>
            <div id="error_box"><br></div>
            <div class="input_box">
                <button onclick="fnLogin()">load</button>
    
            </div>
            <br>
        </div>
    
    </div>
    </body>
    </html>
    <style>
    
    </style>