1.用戶使用流程
為了更好說明用戶使用任務清單的過程,我這里模擬了一個用戶叫小明。
小明是一個程序員仔拟,當天回到公司上班。
接到上司的命令飒赃,要在上午完成自動化網(wǎng)站需要分析利花,11點開會,下午修改昨天程序提出的bug载佳。
1.首先炒事,小明想要使用任務清單,安排一下今天的任務蔫慧,于是他打開一個網(wǎng)站:todomvc.com挠乳。點擊進入后再點擊vue.js版本的任務清單頁面。
2.小明按時間順序依次將自己當天需要完成的任務再輸入框依次輸入姑躲。
3.一個早上過去了睡扬,小明按任務清單的順序,按時將任務完成黍析,于是小明將任務單擊修改成完成狀態(tài)卖怜。
4.小明想看一下自己完成的任務,點擊completed按鈕查看阐枣,看到自己早上完成的任務韧涨。
5.閑著沒事干的小明點擊active按鈕,查看自己還有那些沒有完成的任務
6.看完未完成的任務后侮繁,小明想看一下自己總體的任務狀態(tài),操縱鼠標點擊all按鈕
7.突然如孝,小明接到老板的電話宪哩,叫小明不要去開會了,改去陪客戶聊需求第晰,于是小明修改了任務內容
8.不知不覺一天過去了锁孟,小明再次打開網(wǎng)頁彬祖,看一下任務狀態(tài),發(fā)現(xiàn)任務都完成了品抽,于是小明點擊下拉框储笑,將任務都變成完成狀態(tài)
9.小明看到左下角文字和任務的顏色變化和有一個勾的提示顯示三個任務都完成了,想結束自己完美的一天圆恤,這時小明可以選擇一個個單擊任務后方的紅叉或者點擊clear completed按鈕突倍。
看到這幅圖片,小明知道該下班了盆昙。
2.功能模塊劃分
增加功能:在輸入框輸入后按下enter鍵增加todo項羽历。
修改功能:雙擊任務修改
刪除功能:單擊紅叉或點擊clear completed
查看功能:點擊all或者active或completed