1. 簡單描述下微信小程序的(de)目錄結構？

app.js 小程序邏輯

app.json 小程序公共配置

app.wxss 小程序公共樣式表

js 頁面邏輯

wxml 頁面結構

json 頁面配置

wxss 頁面樣式表

2. wxml與标準的(de)html的(de)異同？

開發工具限制：WXML僅能在(zài)微信小程序開發工具中預覽，而(ér)HTML可以(yǐ)在(zài)浏覽器内預覽。

組件封裝不(bù)同：WXML對組件進行了(le／liǎo)重新封裝，爲(wéi / wèi)後續的(de)性能優化提供了(le／liǎo)可能，

同時(shí)避免開發者寫出(chū)低質量的(de)代碼。

沒有DOM樹：小程序運行在(zài)JS Core内，沒有DOM樹和(hé / huò)window對象，沒有辦法使用相關API。

3. 小程序怎樣進行本地(dì / de)存儲的(de)讀寫？

同步：（1）wx.setStorageSync(); //存儲值

（2）wx.removeStorageSync(); // 移除指定的(de)值

（3）wx.getStorageSync(); // 獲取值

（4）wx.getStorageInfoSync(); // 獲取當前 storage 中所有的(de) key

（5）wx.clearStorageSync(); // 清除所有的(de)key

異步：（1）wx.setStorage(); //存儲值

（2）wx.removeStorage(); // 移除指定的(de)值

（3）wx.getStorage(); // 獲取值

（4）wx.getStorageInfo(); // 獲取當前 storage 中所有的(de) key

（5）wx.clearStorage(); // 清除所有的(de)key

4. 分析下微信小程序的(de)優劣勢？

微信小程序優勢：

1）、使用方便：掃碼即用，相較于(yú)APP而(ér)言不(bù)用下載、不(bù)用安裝，

還可以(yǐ)直接添加到(dào)手機桌面，爲(wéi / wèi)手機節省了(le／liǎo)電量和(hé / huò)大(dà)量内存；

2）、流量入口衆多：公衆号菜單、朋友圈（太陽碼）、微信群、

支持長按二維碼識别、附近的(de)小程序、統一的(de)小程序入口、搜一搜、

公衆号圖文推送、支持發會員卡券（官方的(de)）、支持會員卡直接打開小程序；

3）、潛在(zài)用戶多：小程序依托在(zài)微信9億多用戶群體上(shàng)，不(bù)用擔心找不(bù)到(dào)用戶，

隻需專心做好小程序營銷；

4）、助力新零售：小程序是(shì)新零售的(de)最好載體，将是(shì)未來(lái)線下門店的(de)發展趨勢，

如果企業擁有線下實體門店，小程序是(shì)最佳選擇，可以(yǐ)爲(wéi / wèi)企業更好地(dì / de)切合線上(shàng)線下的(de)流量；

5）、符合消費場景：小程序可以(yǐ)與消費者在(zài)任意場景建立鏈接，即用即走，符合大(dà)多數消費場景。

微信小程序劣勢：

1）、功能不(bù)多：微信小程序屬于(yú)微信，自然也(yě)就(jiù)受限于(yú)微信。

由于(yú)API的(de)限制，小程序的(de)總代碼量不(bù)能超過2M，這(zhè)意味着小程序規模有限，

這(zhè)對一些中大(dà)型的(de)應用而(ér)言是(shì)一個(gè)緻命的(de)缺陷。

目前相較于(yú)APP而(ér)言，微信小程序隻是(shì)能夠實現基本操作，

雖然随着開發技術的(de)發展，小程序已經和(hé / huò)APP很接近，但差距肯定是(shì)存在(zài)的(de)；

2）、所有更新需要(yào / yāo)經過騰訊的(de)審核，才能應用到(dào)小程序中，

這(zhè)給應用的(de)更新帶來(lái)一定的(de)風險，企業希望新加的(de)功能若無法審核通過，

則毫無解決辦法；

3）、不(bù)能用小程序來(lái)發推送通知，必須要(yào / yāo)由用戶操作才可以(yǐ)；

4）、小程序無法被分享到(dào)微信朋友圈，錯失這(zhè)一流量巨大(dà)的(de)入口；

5）、用戶留存差，正是(shì)因爲(wéi / wèi)即用即走的(de)特點，微信小程序對于(yú)用戶的(de)留存相較于(yú)APP、

微信公衆号都是(shì)非常薄弱的(de)，這(zhè)就(jiù)要(yào / yāo)求企業的(de)營銷能力非常突出(chū)，

才能持續增加用戶對小程序的(de)粘性。

5. 小程序的(de)數據驅動和(hé / huò)vue的(de)雙向綁定有何異同？

小程序中的(de)數據雙向綁定

（1）、通過 bindinput 綁定文本框的(de)輸入事件

（2）、在(zài) data 中聲明一個(gè)變量 content ，将其動态綁定成文本框的(de) value 值

（3）、在(zài) bindinput 事件中通過事件參數 e.detail.value 可以(yǐ)獲取到(dào)文本框中最新的(de) value 值

（4）、通過 this.setData 将文本框最新的(de) value 值 賦值給 動态綁定的(de)value值 content 即可實現數據的(de)雙向綁定

vue中的(de)數據雙向綁定

（1）、首先爲(wéi / wèi)文本框綁定 @input 監聽文本框的(de)輸入事件

（2）、爲(wéi / wèi)文本框動态綁定 value 屬性，其值是(shì)在(zài)data中定義的(de)變量

（3）、在(zài) @input綁定的(de)事件中 通過事件參數 event.target.value 可以(yǐ)獲取到(dào) input 框中最新的(de)value值

（4）、将其重新獲取到(dào)的(de) value 賦值給 value值動态綁定的(de)那個(gè)變量

區别

綁定事件不(bù)同，以(yǐ)及獲取value值的(de)具體方式不(bù)同，

以(yǐ)及在(zài)小程序中設置data中的(de)數據，

需要(yào / yāo)調用 this.setData方法進行設置

6. 簡述下wx.navigateTo(), wx.redirectTo(), wx.switchTab(), wx.navigateBack(), wx.reLaunch()的(de)區别？

（1）wx.navigateTo（）：

用于(yú)保留當前頁面、跳轉到(dào)應用内的(de)某個(gè)頁面，使用 wx.navigateBack可以(yǐ)返回到(dào)原頁面。

對于(yú)頁面不(bù)是(shì)特别多的(de)小程序，通常推薦使用 wx.navigateTo進行跳轉，

以(yǐ)便返回原頁面，以(yǐ)提高加載速度。

當頁面特别多時(shí)，則不(bù)推薦使用。

（2）wx.redirectTo（）：

當頁面過多時(shí)，被保留頁面會擠占微信分配給小程序的(de)内存，

或是(shì)達到(dào)微信所限制的(de) 5 層頁面棧。這(zhè)時(shí)應該考慮選擇 wx.redirectTo。

wx.redirectTo()用于(yú)關閉當前頁面，跳轉到(dào)應用内的(de)某個(gè)頁面。

這(zhè)樣的(de)跳轉，可以(yǐ)避免跳轉前頁面占據運行内存，但返回時(shí)頁面需要(yào / yāo)重新加載，

增加了(le／liǎo)返回頁面的(de)顯示時(shí)間。

（3）wx.reLaunch（）：

wx.reLaunch()與 wx.redirectTo()的(de)用途基本相同，

隻是(shì) wx.reLaunch()先關閉了(le／liǎo)内存中所有保留的(de)頁面，

再跳轉到(dào)目标頁面。

（4）wx.switchTab（）：

對于(yú)跳轉到(dào) tab bar 的(de)頁面，

最好選擇 wx.switchTab()，它會先關閉所有非 tab bar 的(de)頁面。

其次，也(yě)可以(yǐ)選擇 wx.reLaunch()，它也(yě)能實現從非 tab bar 跳轉到(dào) tab bar，

或在(zài) tab bar 間跳轉，效果等同 wx.switchTab()。

使用其他(tā)跳轉 API 來(lái)跳轉到(dào) tab bar，則會跳轉失敗。

（5）wx.navigateBack（）：

用于(yú)關閉當前頁面，并返回上(shàng)一頁面或多級頁面。

開發者可通過 getCurrentPages() 獲取當前的(de)頁面棧，決定需要(yào / yāo)返回幾層。

這(zhè)個(gè) API 需要(yào / yāo)填寫的(de)參數隻有 delta，表示要(yào / yāo)返回的(de)頁面數。

若 delta 的(de)取值大(dà)于(yú)現有可返回頁面數時(shí)，則返回到(dào)用戶進入小程序的(de)第一個(gè)頁面。

當不(bù)填寫 delta 的(de)值時(shí)，就(jiù)默認其爲(wéi / wèi) 1（注意，默認并非取 0），即返回上(shàng)一頁面。

7. 小程序頁面路由傳參方法？

通過路徑傳遞參數：wx.navigateTo（）、wx.redirectTo（）和(hé / huò)标簽<navigator/>等

參數與路徑之(zhī)間使用?分隔，參數鍵與參數值用=相連，不(bù)同參數用&分隔

例：test?id=1 中id爲(wéi / wèi)參數鍵，1 爲(wéi / wèi)參數值

在(zài)目的(de)頁面中onLoad（）方法中option對象即爲(wéi / wèi)參數對象，可以(yǐ)通過參數鍵來(lái)取出(chū)參數值

8. 請說(shuō)明小程序的(de)生命周期以(yǐ)及頁面生命周期

小程序生命周期

小程序的(de)生命周期函數是(shì)在(zài)app.js裏面調用的(de)，App(Object)函數用來(lái)注冊一個(gè)小程序。

接受一個(gè) Object 參數，指定其小程序的(de)生命周期回調；一般有onLaunch監聽小程序初始化、

>頁面的(de)生命周期

頁面生命周期函數就(jiù)是(shì)當你每進入/切換到(dào)一個(gè)新的(de)頁面的(de)時(shí)候，就(jiù)會調用的(de)生命周期函數。

Page(Object) 函數用來(lái)注冊一個(gè)頁面。接受一個(gè)Object類型參數，

其指定頁面的(de)初始數據、生命周期回調、事件處理函數等。

9. 小程序如何刷新當前頁面？

方法一：this.onLoad()

方法二：this.onReady() 或者 this.onShow()

方法三：定義标志

在(zài)app.js中，定義一個(gè)全局變量Flag，默認值爲(wéi / wèi)false，

進入其它頁面的(de)時(shí)候将它置爲(wéi / wèi)true,在(zài)頁面的(de)onShow方法裏加一個(gè)判斷,如果Flag爲(wéi / wèi)true的(de)話，

先将它的(de)值設置爲(wéi / wèi)false，再調用接口獲取數據。

10. 小程序中獲取openid的(de)方法？

第一步，獲取code

第二步，根據code獲取openid和(hé / huò)session_key

第三步，檢測用戶登錄狀态是(shì)否有效

具體内容見：“https://blog.csdn.net/llayjun/article/details/78291641”

11. 小程序中獲取用戶的(de)手機号需要(yào / yāo)請求哪些aip？并且解密的(de)參數有哪些？

12. 在(zài)小程序中設置背景圖片在(zài)開發者工具中可以(yǐ)顯示背景圖片，但是(shì)在(zài)手機上(shàng)背景圖片不(bù)顯示，怎麽解決？

圖片轉成Base64格式

在(zài)線轉換：https://www.sojson.com/image2base64.html

13. 小程序中頁面跳轉傳參的(de)方式有哪些？

微信小程序導航有兩種形式：一種是(shì)在(zài)寫在(zài)js中進行跳轉，

另一種是(shì)寫在(zài)wxml頁面中進行跳轉。

14. webview頁面的(de)使用有哪些要(yào / yāo)求

15. bindtap和(hé / huò)catchtap的(de)區别？

bindtap會一直觸發上(shàng)邊的(de)點擊事件，不(bù)會阻止冒泡事件

catchtap隻會執行自己的(de)事件，直接阻止冒泡事件。

16. wx:if 和(hé / huò)v-show 的(de)區别？

17. 如何實現下拉刷新？

wx.startPullDownRefresh（）

開始下拉刷新。調用後觸發下拉刷新動畫，效果與用戶手動下拉刷新一緻。

18. 請寫出(chū)小程序的(de)完整開發流程

（1）申請小程序賬号

（2）申請服務器域名

（3）下載并安裝開發工具（登錄注冊的(de)賬号）

（4）小程序框架配置并開發

（5）window服務器IIS配置和(hé / huò)搭建打包文件上(shàng)傳服務器