《微信小程序項目實戰(zhàn)》課件-CORE07

KeepFit健身我的模塊實現(xiàn)延遲符項目七企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）目錄01學(xué)習(xí)目標(biāo)02學(xué)習(xí)路徑03任務(wù)描述04任務(wù)技能延遲符05任務(wù)實施06任務(wù)總結(jié)01學(xué)習(xí)目標(biāo)延遲符

學(xué)習(xí)目標(biāo)延遲符010203了解小程序我的界面信息掌握小程序的數(shù)據(jù)交互掌握小程序的數(shù)據(jù)存儲學(xué)習(xí)目標(biāo)通過實現(xiàn)KeepFit健身我的模塊，了解在小程序中個人信息顯示的界面擁有哪些信息，掌握小程序的數(shù)據(jù)交互和下拉刷新等最常用的功能，并能熟練掌握小程序存儲數(shù)據(jù)的思路及存儲流程，具有熟練使用小程序常用功能的能力。在任務(wù)實現(xiàn)過程中：04具有熟練使用小程序常用功能的能力企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）02學(xué)習(xí)路徑延遲符

學(xué)習(xí)路徑延遲符企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）延遲符03任務(wù)描述

任務(wù)描述企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）1功能描述2基本框架3情景導(dǎo)入延遲符

情境導(dǎo)入在常見的App中，都會有類似于個人中心的模塊，這是為了用戶能夠更方便地操作、瀏覽自己的相關(guān)信息。因此，研發(fā)團(tuán)隊認(rèn)為在keepFit健身中添加我的模塊是非常重要的。在我的模塊中，用戶能夠方便、快速地找到自己選擇的訓(xùn)練教程、班級、喜歡的音樂及個人信息等。本項目主要通過keepFit健身我的模塊來學(xué)習(xí)微信小程序的數(shù)據(jù)交互與獲取信息。企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）延遲符

功能描述使用wx.getUserInfo(OBJECT)方法進(jìn)行用戶信息的獲取010203

04使用page.onShareAppMessage(options)方法實現(xiàn)轉(zhuǎn)發(fā)功能使用wx.startPullDownRefresh()方法實現(xiàn)下拉刷新企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）延遲符

基本框架企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）延遲符

基本框架企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）延遲符04任務(wù)技能任務(wù)技能數(shù)據(jù)交互下拉刷新數(shù)據(jù)存儲獲取信息

任務(wù)技能延遲符企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）數(shù)據(jù)交互客戶端通過HTTP向服務(wù)端發(fā)送請求，服務(wù)端接收請求并返回數(shù)據(jù)，客戶端根據(jù)返回的數(shù)據(jù)進(jìn)行顯示。微信小程序中向服務(wù)端發(fā)送請求需要用到wx.request（object）方法，在使用該方法時需要添加url、data、method等相關(guān)的參數(shù)數(shù)據(jù)交互延遲符企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）下拉刷新下拉刷新是通過下拉頁面達(dá)到重新加載、刷新的效果，在小程序中通常以三個點的動態(tài)效果顯示。下拉刷新方法如下表所示下拉刷新延遲符企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）方法描述Page.onPullDownRefresh監(jiān)聽下拉刷新wx.startPullDownRefresh()開始下拉刷新wx.startPullDownRefresh()停止下拉刷新數(shù)據(jù)存儲小程序中的數(shù)據(jù)存儲是以鍵值對的形式把數(shù)據(jù)保存在一個在不同頁面都可以使用的存儲空間中。適合緩存的數(shù)據(jù)多為一些靜態(tài)數(shù)據(jù)或頻繁交互的數(shù)據(jù)。每個小程序都包含10M的本地存儲空間。數(shù)據(jù)存儲方法包括同步和異步兩類，以異步方法為例，對數(shù)據(jù)的操作包括添加數(shù)據(jù)wx.setStorage(OBJECT)、獲取數(shù)據(jù)wx.getStorage(OBJECT)、刪除數(shù)據(jù)wx.removeStorage(OBJECT)等。數(shù)據(jù)存儲延遲符企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）獲取信息延遲符企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）用戶信息1系統(tǒng)信息2在微信小程序中用戶信息指的是進(jìn)入當(dāng)前小程序的微信用戶的相關(guān)信息，包括用戶的昵稱、頭像及所在地區(qū)等。獲取用戶信息的方法是在函數(shù)中調(diào)用wx.getUserInfo(OBJECT)方法，用戶信息可在調(diào)用成功后執(zhí)行的success函數(shù)的userInfo參數(shù)中獲取。微信小程序中可以獲取的系統(tǒng)信息包括一些設(shè)備信息比如設(shè)備的品牌、型號、屏幕大小等，還有一些與微信客戶端相關(guān)的信息比如微信版本號、字體大小等。獲取系統(tǒng)信息的方法也分為同步和異步兩種同步：wx.getSystemInfoSync()異步：wx.getSystemInfo(OBJECT)獲取信息延遲符企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）網(wǎng)絡(luò)狀態(tài)3登錄4轉(zhuǎn)發(fā)信息5小程序中可以通過調(diào)用wx.getNetworkType(OBJECT)方法獲取網(wǎng)絡(luò)狀態(tài)，調(diào)用wx.onNetworkStatusChange(CALLBACK)方法監(jiān)聽網(wǎng)絡(luò)變化獲取網(wǎng)絡(luò)類型。兩個方法共同實現(xiàn)網(wǎng)絡(luò)狀態(tài)的獲取及監(jiān)聽調(diào)用微信登錄方法（wx.login(object)）可以獲取唯一標(biāo)識符以及成功時返回的參數(shù)。當(dāng)用戶一段時間不使用小程序，用戶的登錄狀態(tài)可能失效，小程序提供了（wx.checkSession(object)）方法用于檢測用戶的登錄狀態(tài)在小程序中轉(zhuǎn)發(fā)功能主要是依賴page.onShareAppMessage(options)函數(shù)方法實現(xiàn)的設(shè)置轉(zhuǎn)發(fā)內(nèi)容需要用到return，return包含的屬性包括標(biāo)題title、路徑path等05任務(wù)實施延遲符輸入標(biāo)題輸入標(biāo)題輸入標(biāo)題第一步：在頁面中添加個人信息部分，包括頭像、昵稱、賬號并在.js文件中獲取用戶信息第二步：設(shè)置個人信息部分樣式，包括頭像大小、昵稱容器的flex布局等第三步：使用wx:for循環(huán)添加下邊的列表內(nèi)容，設(shè)置對應(yīng)的樣式并添加對應(yīng)的頁面跳轉(zhuǎn)事件第四步：對右上角圖標(biāo)添加彈出菜單列表的事件并對列表中的掃一掃和地理定位的功能進(jìn)行添加點擊輸入說明文字點擊輸入說明文字點擊輸入說明文字

任務(wù)實施延遲符企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）輸入標(biāo)題輸入標(biāo)題輸入標(biāo)題第一步：使用view標(biāo)簽在頁面中添加更換頭像部分，第二步：使用wx:for渲染中間和下邊的列表并對其相應(yīng)樣式進(jìn)行添加第三步：對列表中的聯(lián)系我們的項綁定對應(yīng)的事件并對頁面底部的退出賬號的按鈕進(jìn)行添加第四步：使用wx.makePhoneCall()方法對撥打電話的功能進(jìn)行添加點擊輸入說明文字點擊輸入說明文字點擊輸入說明文字

任務(wù)實施延遲符企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）06任務(wù)總結(jié)延遲符任務(wù)技能任務(wù)實施任務(wù)總結(jié)任務(wù)描述本任務(wù)通過學(xué)習(xí)KeepFit健身我的模塊，對小程序我的模塊擁有哪些信息有所了解，能過對小程序的數(shù)據(jù)交互、下拉刷新、數(shù)據(jù)存儲、獲取設(shè)備或個人信息有所掌握，能夠使用小程序數(shù)據(jù)存儲的功能與后臺進(jìn)行一個交互。

任務(wù)總結(jié)延遲符企業(yè)級卓越人才培養(yǎng)（信息類專業(yè)集群）謝謝觀賞延遲符PPT模板下載：/moban/行業(yè)PPT模板：/hangye/節(jié)日PPT模板：/jieri/PPT素材下載：/sucai/PPT背景圖片：/beijing/PPT圖表下載：/tubiao/優(yōu)秀PPT下載：/xiazai/PPT教程：/powerpoint/Word教