摘要：掘金主頁簡書主頁遲到太久就不必到了開發(fā)環(huán)境需要的信息和信息源如何使用與進(jìn)行數(shù)據(jù)交互使用后端框架實(shí)現(xiàn)靜態(tài)服務(wù)器使用前端框架實(shí)現(xiàn)單頁應(yīng)用前端部分統(tǒng)計(jì)頁面計(jì)算屬性和偵聽器主頁注冊界面條件渲染登陸界面后臺用戶管理的界面列表渲染用戶界面調(diào)查問

ArthurSlog

SLog-31

Year·1

Guangzhou·China

Aug 6th 2018

GitHub

掘金主頁

簡書主頁

segmentfault

遲到太久 就不必到了

Slog1_如何使用nodejs與mysql進(jìn)行數(shù)據(jù)交互

Slog4_使用后端框架KOA實(shí)現(xiàn)靜態(tài)web服務(wù)器

Slog6_使用vue前端框架實(shí)現(xiàn)單頁應(yīng)用(SPA)

Slog24

Slog25

Slog26

前端部分：

統(tǒng)計(jì)頁面-計(jì)算屬性和偵聽器、https://cn.vuejs.org/v2/guide... 主頁：index.html

注冊界面-條件渲染、https://cn.vuejs.org/v2/guide... :signup.html

登陸界面 :signin.html

后臺用戶管理的界面-列表渲染、https://cn.vuejs.org/v2/guide... 用戶界面: account.hmtl

調(diào)查問卷-文本、多行文本、復(fù)選框、單選按鈕、選擇框、https://cn.vuejs.org/v2/guide... : form.html

離開頁面提醒-事件處理、https://cn.vuejs.org/v2/guide...

移動端樣式兼容-Class與Style綁定、https://cn.vuejs.org/v2/guide...

后端部分：

數(shù)據(jù)庫數(shù)據(jù)交互模塊-部署、配置

靜態(tài)web服務(wù)器

用戶注冊模塊

用戶登陸模塊

統(tǒng)計(jì)分析模塊

用戶狀態(tài)模塊-超時、無效、非法

關(guān)鍵思路

切換至 client 文件夾路徑下

cd client

修改和調(diào)整 signup.html 文件

signup.html

    
    
    
    
    




    

        
This is signup"s page by ArthurSlog
        
Singup

        


            

            

                Account:
                

                
            
            


            

            

                Password:
                

                
            
            


            

            

                Again Password:
                

                
            
            



            

            

                First Name:
                

                
            
            


            

            

                Last Name:
                

                
            
            


            

            

                Birthday:
                

                
            
            


            

            

                Sex: {{ sex }}
                

                
                Male
                

                
                Female
            
            


            

            

                Age: {{ age }}
                

                
                    Select
                    1
                    2
                    3
                    4
                    5
                    6
                    7
                    8
                    9
                    10
                    11
                    12
                    13
                    14
                    15
                    16
                    17
                    18
                    19
                
            
            


            

            

                Wechart:
                

                
            
            


            

            

                QQ:
                

                
            
            


            

            

                Email:
                

                
            
            


            

            

                Contury:
                

                
            
            


            

            

                Address:
                

                
            
            


            

            

                Phone:
                

                
            
            


            

            

                Websize:
                

                
            
            


            

            

                Github:
                

                
            
            


            

            

                Bio:
                

                
            
            


            

            
        

        Return index"s page
        

        

    

    

切換至server文件夾路徑下

cd server

現(xiàn)在，啟動靜態(tài)web服務(wù)器

node index.js

現(xiàn)在打開瀏覽器，在地址欄輸入 127.0.0.1:3000，正常顯示主頁后，點(diǎn)擊 signup 鏈接，正常情況下，signup.html 頁面會顯得更加的簡潔，同時撤掉了多余的跳轉(zhuǎn)鏈接

至此，我們更新了 signup.html 的頁面風(fēng)格。