《微信小程序項目實戰(zhàn)》全套教學課件

項目Ⅰ豆瓣評分《微信小程序項目實戰(zhàn)》項目Ⅰ豆瓣評分.pptx項目Ⅱ琪斐定制家居館.pptx項目Ⅲ番茄時鐘.pptx全套可編輯PPT課件目錄單元一

項目準備單元二

自定義組件的封裝單元三

首頁單元四

列表頁單元五

搜索功能單元六

詳情頁單元七

短評列表功能163單元一項目準備單元一：項目準備本單元主要介紹微信小程序項目開發(fā)之前的準備工作，包括TAPD的使用、Git的使用、碼云（Gitee）的使用，以及在微信開發(fā)者工具中完成項目的創(chuàng)建。1.掌握TAPD工具的使用方法2.掌握Git版本控制系統(tǒng)的基本配置與使用方法3.掌握碼云（Gitee）的基本操作方法4.掌握微信開發(fā)者工具的使用方法5.掌握微信小程序項目的創(chuàng)建6.熟悉微信小程序基本目錄結構任務一：TAPD的使用任務一：TAPD的使用注冊個人賬號。（進入官網(wǎng)/，導航欄右側“注冊”按鈕）步驟1登錄帳號。（進入官網(wǎng)/，導航欄右側“登錄”按鈕）步驟2注冊公司。（注冊個人賬號后進入TAPD官網(wǎng)注冊頁面）步驟3創(chuàng)建項目。步驟4邀請成員。步驟5知識鏈接任務考評【TAPD的使用】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01注冊個人賬號10

02登錄帳號10

03注冊公司20

04創(chuàng)建項目25

05邀請成員25

06完成任務收獲積累：10

總評分100

任務二：Git的安裝與使用任務二：產(chǎn)品展示頁下載Git離線安裝包。網(wǎng)址https:///downloads。步驟1安裝Git。步驟2Git的使用。步驟3Git基本操作。步驟4知識鏈接知識鏈接任務考評【Git的安裝和使用】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01下載電腦系統(tǒng)對應git安裝包5

02正確安裝git10

03創(chuàng)建git倉庫10

04添加文件到git暫存區(qū)25

05將暫存區(qū)文件提交到倉庫25

06檢查是否有未提交文件15

07完成任務收獲積累：10

總評分100

任務三：碼云（Gitee）的使用任務三：碼云（Gitee）的使用創(chuàng)建碼云帳號。步驟1代碼托管。步驟2向倉庫提交代碼。步驟3知識鏈接任務考評【碼云的使用】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01創(chuàng)建碼云gitee帳號5

02創(chuàng)建gitee遠程倉庫15

03提交代碼：方式一所有步驟35

04提交代碼：方式二所有步驟35

05完成任務收獲積累：10

總評分100

任務四：創(chuàng)建項目任務四：創(chuàng)建項目在TAPD中創(chuàng)建項目，邀請項目參與者，給項目參與者分配任務，協(xié)同完成項目。步驟1在碼云（Gitee）上創(chuàng)建“豆瓣評分”倉庫，并獲取倉庫地址：“/用戶個人空間地址/倉庫名”。步驟2注冊登錄微信公眾平臺以及安裝微信開發(fā)者工具。步驟3在微信開發(fā)者工具中配置版本管理（git）工具。步驟5整理項目初始代碼。步驟6利用微信開發(fā)者工具創(chuàng)建“豆瓣評分”項目。步驟4新建所需頁面，并設置pages屬性。步驟7知識鏈接知識鏈接知識鏈接知識鏈接知識鏈接知識鏈接知識鏈接知識鏈接知識鏈接任務考評【創(chuàng)建項目】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01在TAPD中創(chuàng)建項目，邀請項目參與者，給項目參與者分配任務，協(xié)同完成項目。20

02在碼云（Gitee）上創(chuàng)建“豆瓣評分”倉庫，并獲取倉庫地址。15

03注冊登錄微信公眾平臺及其安裝微信開發(fā)者工具。10

04利用微信開發(fā)者工具創(chuàng)建“豆瓣評分”項目。10

05在微信開發(fā)者工具中配置版本管理（git）工具。15

06整理初始代碼，刪除部分文件及代碼。10

07新建所需頁面，并設置pages屬性。10

08完成任務收獲積累：10

總評分100

單元二自定義組件的封裝單元二：自定義組件的封裝在微信小程序開發(fā)項目中封裝自定義組件，有助于代碼的重用，可以大大提高開發(fā)效率，本單元主要完成了五個任務分別是，搜索欄、評分星星組件、數(shù)據(jù)模塊組件、首頁模塊組件、短評組件的實現(xiàn)。1.熟悉微信小程序MVC框架2.掌握微信小程序自定義組件的基本知識和使用方法3.掌握view、navigator組件的使用方法4.掌握image組件、wx:for列表渲染的使用5.掌握scroll-view可滾動視圖容器組件的使用任務一：搜索欄的實現(xiàn)任務一：搜索欄的實現(xiàn)新建components/searchbar目錄。步驟1搜索欄的視圖層渲染。步驟2為組件添加功能。步驟3組件測試。步驟4知識鏈接知識鏈接知識鏈接知識鏈接知識鏈接任務考評【搜索欄的實現(xiàn)】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01創(chuàng)建組件目錄15

02組件視圖層渲染25

03組件引用10

04組件樣式添加20

05添加組件事件20

06完成任務收獲積累：10

總評分100

任務二：評分星星組件的實現(xiàn)任務二：評分星星組件的實現(xiàn)新建components/stars目錄。步驟1評分星星組件的視圖層渲染。步驟2打開stars.js文件，為該自定義組件添加updateRate方法，根據(jù)傳入分值計算出滿星星、半星星和灰色星星的個數(shù)，在methods對象下添加代碼。步驟3為該自定義組件添加屬性值，在properties對象下添加代碼。步驟4添加生命周期函數(shù)，在組件掛載時調(diào)用星星個數(shù)統(tǒng)計，添加代碼。步驟5打開index.json文件，在usingComponents對象下添加組件引用代碼。步驟6打開index.wxml文件，添加搜索欄組件代碼。步驟7知識鏈接知識鏈接知識鏈接任務考評【評分星星的實現(xiàn)】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01創(chuàng)建文件及目錄5

02評分星星視圖層構建渲染10

03添加評分星星樣式5

04添加評分星星計算方法25

05設置評分星星傳入屬性25

06組件測試20

07完成任務收獲積累：10

總評分100

任務三：數(shù)據(jù)模塊組件的實現(xiàn)任務三：數(shù)據(jù)模塊組件的實現(xiàn)新建components/itemview目錄。步驟1數(shù)據(jù)模塊組件的視圖層渲染。步驟2打開itemview.js文件為該自定義組件添加屬性值，在properties對象下添加代碼。步驟3組件測試。步驟4知識鏈接任務考評【數(shù)據(jù)模塊組件的實現(xiàn)】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01創(chuàng)建目錄與文件5

02數(shù)據(jù)模塊視圖層的渲染10

03添加數(shù)據(jù)模塊樣式5

04星星評價組件引入25

05添加數(shù)據(jù)模塊方法25

06組件測試20

07完成任務收獲積累：10

總評分100

任務四：首頁模塊組件的實現(xiàn)任務四：首頁模塊組件的實現(xiàn)新建components/indexmodule目錄。步驟1首頁模塊組件視圖層渲染。步驟2打開indexmodule.wxss文件,為視圖層添加樣式文件。步驟3打開indexmodule.js文件為該自定義組件添加屬性值，在properties對象下添加代碼。步驟4打開index.json文件，在usingComponents對象下添加組件引用代碼。步驟5知識鏈接知識鏈接任務考評【首頁模塊組件的實現(xiàn)】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01建立indexmodule目錄及文件5

02引用數(shù)據(jù)模塊組件5

03構建首頁模塊視圖層10

04添加首頁模塊樣式25

05添加首頁模塊屬性與方法25

06組件測試20

07完成任務收獲積累：10

總評分100

任務五：短評組件的實現(xiàn)任務五：短評組件的實現(xiàn)新建components/onecomment目錄。步驟1短評組件的視圖層渲染。步驟2打開onecomment.js文件為該自定義組件添加屬性值，在properties對象下添加代碼。步驟3組件測試。步驟4知識鏈接知識鏈接任務考評【短評組件的實現(xiàn)】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01建立目錄及文件5

02引用星星評分組件5

03構建短評組件視圖層10

04添加短評組件樣式25

05添加短評組件屬性與方法25

06組件測試20

07完成任務收獲積累：10

總評分100

單元三首頁單元三：首頁豆瓣評分小程序的首頁分為搜索欄和主體內(nèi)容兩部分，在首頁中既可以搜索查看自己感興趣的影視作品，也可以分模塊快速瀏覽最新上映的影片評分情況。1.掌握使用微信小程序網(wǎng)絡請求方法。2.掌握ES6模塊中的export與import的使用方法。3.了解小程序頁面生命周期。任務：首頁的實現(xiàn)任務：首頁的實現(xiàn)為首頁添加頁面渲染。步驟1添加工具類，方便網(wǎng)絡請求地址集中管理及網(wǎng)絡接口統(tǒng)一調(diào)用。步驟2為首頁頁面添加業(yè)務邏輯代碼。步驟3知識鏈接知識鏈接知識鏈接知識鏈接任務考評【首頁】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01引用組件5

02構建首頁視圖10

03建立工具類5

04封裝函數(shù)25

05拋出與引用函數(shù)25

06在生命周期中使用封裝函數(shù)20

07完成任務收獲積累：10

總評分100

單元四列表頁單元四：列表頁在“豆瓣評分”微信小程序中，列表頁用于展示電影、電視劇、綜藝類型影片的全部數(shù)據(jù)內(nèi)容，需要引用自定義組件searchbar和itemview，具體任務通過頁面渲染和業(yè)務邏輯實現(xiàn)。1.掌握微信小程序中使用wx:for實現(xiàn)對象的遍歷2.掌握使用setData函數(shù)將數(shù)據(jù)從邏輯層發(fā)送到視圖層的實現(xiàn)方法任務：列表頁的實現(xiàn)任務：列表頁的實現(xiàn)為列表頁添加頁面渲染。步驟1為列表頁面添加業(yè)務邏輯代碼。步驟2知識鏈接知識鏈接任務考評【列表頁功能】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01引用組件10

02列表頁頁面渲染20

03頁面樣式20

04邏輯實現(xiàn)40

05完成任務收獲積累：10

總評分100

單元五搜索功能單元五：搜索功能豆瓣小程序首頁最上方為搜索欄圖片，單擊可跳轉(zhuǎn)至搜索頁面。在搜索頁面上方的搜索欄中輸入關鍵字，可查找到相關的電影、電視劇等影視作品信息，并在頁面下方通過列表信息呈現(xiàn)，通過搜索頁面可實現(xiàn)小程序的搜索功能。1.熟悉如何使用API實現(xiàn)本地數(shù)據(jù)緩存和清理本地緩存數(shù)據(jù)2.掌握wx.setStorage和wx.removeStorageAPI接口使用方法任務：搜索功能的實現(xiàn)任務：搜索功能的實現(xiàn)為搜索頁添加頁面渲染。步驟1修改工具類，方便網(wǎng)絡請求地址集中管理及網(wǎng)絡接口統(tǒng)一調(diào)用。步驟2為搜索頁面添加業(yè)務邏輯代碼。步驟3知識鏈接知識鏈接任務考評【搜索功能】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01搜索頁視圖渲染10

02添加搜索頁樣式25

03添加修改工具類25

04添加業(yè)務邏輯30

05完成任務收獲積累：10

總評分100

單元六詳情頁單元六：詳情頁“豆瓣評分”小程序中的詳情頁是對影視作品的具體介紹，包括作品簡介及評論。本單元主要介紹詳情頁中基本信息、標簽信息和短評信息展示的實現(xiàn)。1.熟悉微信小程序中的網(wǎng)絡請求。2.熟悉小程序頁面生命周期。3.掌握flex布局樣式。4.熟悉text組件使用方法。5.掌握封裝函數(shù)的使用任務一：基本信息展示任務一：基本信息展示為詳情頁中添加頁面渲染。步驟1修改工具類，方便網(wǎng)絡請求地址集中管理及網(wǎng)絡接口統(tǒng)一調(diào)用。步驟2為詳情頁頁面添加業(yè)務邏輯代碼。步驟3知識鏈接知識鏈接任務考評【詳情頁】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01

“基本信息展示”部分頁面構建20

02添加樣式25

03修改工具類25

04添加業(yè)務邏輯代碼20

05完成任務收獲積累：10

總評分100

任務二：標簽信息展示任務二：標簽信息展示為詳情頁的視圖層添加標簽信息展示部分的渲染。步驟1修改工具類，方便網(wǎng)絡請求地址集中管理及網(wǎng)絡接口統(tǒng)一調(diào)用。步驟2為詳情頁頁面添加業(yè)務邏輯代碼。步驟3知識鏈接任務考評【標簽信息展示】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01標簽信息視圖構建10

02添加標簽信息樣式25

03添加修改工具類25

04添加業(yè)務邏輯30

05完成任務收獲積累：10

總評分100

任務三：短評信息展示任務三：短評信息展示為短評信息添加頁面渲染。步驟1修改工具類，方便網(wǎng)絡請求地址集中管理及網(wǎng)絡接口統(tǒng)一調(diào)用。步驟2為詳情頁頁面添加業(yè)務邏輯代碼。步驟3任務考評【短評信息展示】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01視圖層構建15

02添加樣式15

03修改工具類20

04封裝函數(shù)20

05添加業(yè)務邏輯20

06完成任務收獲積累：10

總評分100

單元七短評列表功能單元七：短評列表功能“豆瓣評分”小程序中的短評列表頁用于顯示每個影視作品的所有評論內(nèi)容，該頁面的具體實現(xiàn)主要通過頁面構建、添加樣式、封裝函數(shù)和添加業(yè)務邏輯完成。1.熟悉button組件的使用2.熟練掌握事件函數(shù)的創(chuàng)建與使用3.掌握wx.navigateBack()接口的功能與使用方法任務：短評列表功能實現(xiàn)任務：短評列表功能實現(xiàn)為短評列表頁添加頁面渲染。步驟1為短評列表頁面添加業(yè)務邏輯代碼。步驟2知識鏈接知識鏈接知識鏈接任務考評【短評列表功能】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01短評列表頁面構建20

02添加樣式25

03封裝函數(shù)25

04添加業(yè)務邏輯20

05完成任務收獲積累：10

總評分100

THANK

YOU!項目Ⅱ：琪斐定制家居館《微信小程序項目實戰(zhàn)》目錄單元一

產(chǎn)品展示和聯(lián)系我們單元二

首頁模塊單元一產(chǎn)品展示和聯(lián)系我們單元一：產(chǎn)品展示和聯(lián)系我們本單元介紹了“琪斐定制家居館”小程序中“產(chǎn)品展示”和“聯(lián)系我們”模塊的實現(xiàn)，具體分為3個任務，配置tab標簽導航、產(chǎn)品展示頁和聯(lián)系我們頁面。1.熟悉小程序全局配置文件app.json功能；2.掌握app.json文件中“pages”屬性、“window”對象、“tabBar”屬性的使用方法；3.掌握image組件的使用方法；4.掌握內(nèi)置地圖與撥打電話API的使用。任務一：配置tab標簽導航任務一：配置tab標簽導航整理初始代碼，刪除部分文件及代碼。步驟1配置底部tab標簽導航。步驟2圖2-1-3products目錄配置底部tab標簽導航。步驟2知識鏈接知識鏈接任務考評姓名

完成日期

序號考核內(nèi)容標準分評分01整理初始代碼，刪除部分文件及代碼。40

02配置底部tab標簽導航。50

03完成任務收獲積累：10

總評分100

【配置tab標簽導航】考評記錄任務二：產(chǎn)品展示頁任務二：產(chǎn)品展示頁為視圖層添加頁面渲染，打開文件products.wxml，并添加代碼：步驟1打開樣式文件products.wxss，添加代碼：步驟2知識鏈接知識鏈接知識鏈接任務考評【產(chǎn)品展示頁】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01視圖層頁面渲染40

02添加頁面樣式50

03完成任務收獲積累：10

總評分100

任務三：聯(lián)系我們頁任務三：聯(lián)系我們頁為“聯(lián)系我們”頁視圖層添加渲染，打開me.wxml文件，并添加代碼。步驟1添加樣式文件，打開me.wxss文件，添加代碼。步驟2打開me.js文件，為公司地址添加click單擊事件，調(diào)用內(nèi)置地圖API。為電話按鈕添加teltoUs單擊事件，調(diào)用撥打電話的小程序API。在Page對象下，添加代碼。步驟3知識鏈接知識鏈接任務考評【聯(lián)系我們】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01視圖層頁面渲染30

02添加頁面樣式30

03添加單擊事件，調(diào)用內(nèi)置地圖與撥打電話API30

04完成任務收獲積累：10

總評分100

單元二首頁模塊單元二：首頁模塊“琪斐定制家居館”小程序的首頁模塊由首頁展示、公司簡介頁、產(chǎn)品服務頁、典型案例頁和最新產(chǎn)品頁5個任務組成。1.熟悉輪播圖與九宮格導航欄的制作2.掌握swiper組件和blockwx:for的使用方法3.掌握頁面與js文件的數(shù)據(jù)綁定4.熟悉bindtap點擊事件的使用5.掌握wx.makePhoneCall撥打電話API的使用任務一：首頁展示任務一：首頁展示頂部輪播圖效果實現(xiàn)。步驟1構建九宮格導航欄。步驟2底部廣告效果實現(xiàn)。步驟3知識鏈接任務考評【首頁展示】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01頂部輪播圖效果實現(xiàn)40

02構建九宮格導航欄40

03底部廣告效果實現(xiàn)10

04完成任務收獲積累：10

總評分100

任務二：公司簡介頁任務二：公司簡介頁為公司簡介頁視圖層添加渲染，打開company.wxml文件，并添加代碼：步驟1添加樣式文件，打開company.wxss文件，添加代碼：步驟2為該頁面添加數(shù)據(jù)綁定，打開company.js文件，在data中添加如下代碼，實現(xiàn)頁面與js文件的數(shù)據(jù)綁定操作：步驟3任務考評【公司簡介頁】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01頁面視圖層渲染30

02添加樣式40

03頁面與js文件的數(shù)據(jù)綁定20

04完成任務收獲積累：10

總評分100

任務三：產(chǎn)品服務頁任務三：產(chǎn)品服務頁為產(chǎn)品服務頁視圖層添加渲染，采用wx:for列表渲染減少代碼量。打開service.wxml文件，并添加代碼。步驟1為其添加樣式文件，打開service.wxss文件，添加代碼。步驟2為該頁面添加數(shù)據(jù)綁定，打開service.js文件，在data下添加代碼，實現(xiàn)頁面與js文件的數(shù)據(jù)綁定操作。步驟3知識鏈接知識鏈接任務考評【產(chǎn)品服務頁】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01頁面視圖層渲染30

02添加樣式30

03頁面與js文件的數(shù)據(jù)綁定30

04完成任務收獲積累：10

總評分100

任務四：典型案例頁任務四：典型案例頁為典型案例頁視圖層添加渲染，采用顯示數(shù)據(jù)與列表數(shù)據(jù)相結合的方式實施。打開classic.wxml文件，并添加代碼。步驟1為其添加樣式文件，打開classic.wxss文件，添加代碼。步驟2為該頁面添加數(shù)據(jù)綁定，打開classic.js文件，在data下添加如下代碼，實現(xiàn)頁面與js文件的數(shù)據(jù)綁定操作。步驟3任務考評【典型案例頁】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01頁面視圖層渲染30

02添加樣式30

03頁面與js文件的數(shù)據(jù)綁定30

04完成任務收獲積累：10

總評分100

任務五：最新產(chǎn)品頁任務五：最新產(chǎn)品頁為最新產(chǎn)品頁視圖層添加渲染。打開newest.wxml文件，并添加代碼。步驟1為頁面添加樣式文件，打開newest.wxss文件，添加代碼。步驟2為電話訂單按鈕添加單擊事件，調(diào)用撥打電話的小程序API。步驟3知識鏈接任務考評【最新產(chǎn)品頁】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01頁面視圖層渲染30

02添加樣式30

03添加單擊事件，調(diào)用撥打電話小程序API30

04完成任務收獲積累：10

總評分100

THANK

YOU!項目Ⅲ番茄時鐘《微信小程序項目實戰(zhàn)》目錄單元一

主頁單元二

記錄頁單元三

設置頁單元四

項目測試及審核與發(fā)布單元一主頁單元一：主頁“番茄時鐘”小程序中的主頁能夠在點擊按鈕時實現(xiàn)“工作”與“休息”兩種狀態(tài)下的倒計時，功能實現(xiàn)具體通過頁面設計和邏輯層兩個任務完成。1.熟悉app.wxss文件的作用2.掌握input組件的使用方法3.熟悉wx.getStorage和wx.getStorageSync緩存數(shù)據(jù)的使用任務一：頁面設計任務一：頁面設計整理初始代碼，刪除部分文件及代碼。步驟1打開app.json文件，添加tab標簽導航頁設置，順序添加如下代碼。步驟2主頁視圖層渲染。步驟3知識鏈接知識鏈接任務考評【頁面設計】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01整理初始代碼20

02添加tab標簽導航30

03主頁視圖層渲染40

04完成任務收獲積累：10

總評分100

任務二：邏輯層開發(fā)任務二：產(chǎn)品展示頁定義全局默認數(shù)據(jù)變量步驟1定義頁面臨時變量，用來控制按鈕顯示內(nèi)容展示和圓環(huán)顯示角度。打開index.js文件，在Page函數(shù)前添加臨時變量，添加代碼。步驟2添加頁面數(shù)據(jù)綁定變量，在Page函數(shù)中添加data對象，與xml文件綁定顯示,添加代碼。步驟3在頁面展示時，將緩存中保存的數(shù)據(jù)提取出來，顯示在頁面上。在onShow生命周期函數(shù)中添加代碼。步驟5實現(xiàn)倒計時功能并且保存操作記錄。。步驟6定義formatTime函數(shù)，作用是時間轉(zhuǎn)換，保證都是二位數(shù)顯示。如將1轉(zhuǎn)換成01，2轉(zhuǎn)換成02，添加代碼。步驟4知識鏈接任務考評【邏輯層開發(fā)】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01定義全局默認數(shù)據(jù)變量、頁面臨時變量、15

02添加頁面數(shù)據(jù)綁定變量、formatTime函數(shù)15

03提取緩存數(shù)據(jù)，顯示在頁面上20

04實現(xiàn)倒計時功能并保存操作記錄40

05完成任務收獲積累：10

總評分100

單元二記錄頁單元二：記錄頁“番茄時鐘”小程序記錄頁是一個將倒計時發(fā)生開始與停止時間與狀態(tài)進行展示的頁面，頁面及功能實現(xiàn)主要通過視圖層渲染、添加樣式和邏輯層開發(fā)完成。1.熟悉wx.setNavigationBarTitle小程序API的使用2.掌握scroll-view組件的使用3.掌握wx.showToast、wx.showModal小程序API的使用任務：記錄頁的實現(xiàn)任務：記錄頁的實現(xiàn)記錄頁視圖層渲染，打開record.wxml文件，并添加代碼。步驟1為記錄頁添加樣式文件，打開record.wxss文件，添加代碼。步驟2為記錄頁添加業(yè)務邏輯代碼。步驟3知識鏈接知識鏈接知識鏈接任務考評【記錄頁】考評記錄姓名

完成日期

序號考核內(nèi)容標準分評分01記錄頁視圖層渲染30

02添加樣式30

03邏輯層開發(fā)30

04完成任務收獲積累：10

總評分100

單元三設置頁單元三：設置頁番茄時鐘小程序的“設置頁”可以對工作和休息狀態(tài)下倒計時時長等參數(shù)進行設置，頁面及功能實現(xiàn)通過頁面視圖層渲染、添加樣式和邏輯層開發(fā)完