1 請(qǐng)談?wù)勎⑿判〕绦蛑饕夸浐臀募淖饔茫?/h4>
-
project.config.json 項(xiàng)目配置文件,用得最多的就是配置是否開啟https校驗(yàn);
-
App.js 設(shè)置一些全局的基礎(chǔ)數(shù)據(jù)等;
-
App.json 底部tab, 標(biāo)題欄和路由等設(shè)置;
-
App.wxss 公共樣式,引入iconfont等;
-
pages 里面包含一個(gè)個(gè)具體的頁(yè)面;
-
index.json (配置當(dāng)前頁(yè)面標(biāo)題和引入組件等);
-
index.wxml (頁(yè)面結(jié)構(gòu));
-
index.wxss (頁(yè)面樣式表);
-
index.js (頁(yè)面的邏輯,請(qǐng)求和數(shù)據(jù)處理等);
2 請(qǐng)談?wù)剋xml與標(biāo)準(zhǔn)的html的異同?
-
都是用來(lái)描述頁(yè)面的結(jié)構(gòu);
-
都由標(biāo)簽、屬性等構(gòu)成;
-
標(biāo)簽名字不一樣,且小程序標(biāo)簽更少,單一標(biāo)簽更多;
-
多了一些 wx:if 這樣的屬性以及 {{ }} 這樣的表達(dá)式
-
WXML僅能在微信小程序開發(fā)者工具中預(yù)覽,而HTML可以在瀏覽器內(nèi)預(yù)覽
-
組件封裝不同, WXML對(duì)組件進(jìn)行了重新封裝,
-
小程序運(yùn)行在JS Core內(nèi),沒有DOM樹和window對(duì)象,小程序中無(wú)法使用window對(duì)象和document對(duì)象。
3 請(qǐng)談?wù)刉XSS和CSS的異同?
-
都是用來(lái)描述頁(yè)面的樣子;
-
WXSS 具有 CSS 大部分的特性,也做了一些擴(kuò)充和修改;
-
WXSS新增了尺寸單位,WXSS 在底層支持新的尺寸單位 rpx;
-
WXSS 僅支持部分 CSS 選擇器;
-
WXSS 提供全局樣式與局部樣式
4 你是怎么封裝微信小程序的數(shù)據(jù)請(qǐng)求的?
-
在根目錄下創(chuàng)建utils目錄及api.js文件和apiConfig.js文件;
-
在apiConfig.js 封裝基礎(chǔ)的get, post 和 put, upload等請(qǐng)求方法,設(shè)置請(qǐng)求體,帶上token和異常處理等;
-
在api中引入apiConfig.js封裝好的請(qǐng)求方法,根據(jù)頁(yè)面數(shù)據(jù)請(qǐng)求的urls, 設(shè)置對(duì)應(yīng)的方法并導(dǎo)出;
-
在具體的頁(yè)面中導(dǎo)入;
5 小程序頁(yè)面間有哪些傳遞數(shù)據(jù)的方法?
-
使用全局變量實(shí)現(xiàn)數(shù)據(jù)傳遞
-
頁(yè)面跳轉(zhuǎn)或重定向時(shí),使用url帶參數(shù)傳遞數(shù)據(jù)
-
使用組件模板 template傳遞參數(shù)
-
使用緩存?zhèn)鬟f參數(shù)
-
使用數(shù)據(jù)庫(kù)傳遞數(shù)據(jù)
6 請(qǐng)談?wù)勑〕绦虻碾p向綁定和vue的異同?
大體相同,但小程序直接this.data的屬性是不可以同步到視圖的,必須調(diào)用this.setData()方法!
7 請(qǐng)談?wù)勑〕绦虻纳芷诤瘮?shù)?
-
onLoad() 頁(yè)面加載時(shí)觸發(fā),只會(huì)調(diào)用一次,可獲取當(dāng)前頁(yè)面路徑中的參數(shù)。
-
onShow() 頁(yè)面顯示/切入前臺(tái)時(shí)觸發(fā),一般用來(lái)發(fā)送數(shù)據(jù)請(qǐng)求;
-
onReady() 頁(yè)面初次渲染完成時(shí)觸發(fā), 只會(huì)調(diào)用一次,代表頁(yè)面已可和視圖層進(jìn)行交互。
-
onHide() 頁(yè)面隱藏/切入后臺(tái)時(shí)觸發(fā), 如底部 tab 切換到其他頁(yè)面或小程序切入后臺(tái)等。
-
onUnload() 頁(yè)面卸載時(shí)觸發(fā),如redirectTo或navigateBack到其他頁(yè)面時(shí)。
8 簡(jiǎn)述微信小程序原理?
-
小程序本質(zhì)就是一個(gè)單頁(yè)面應(yīng)用,所有的頁(yè)面渲染和事件處理,都在一個(gè)頁(yè)面內(nèi)進(jìn)行,但又可以通過微信客戶端調(diào)用原生的各種接口;
-
它的架構(gòu),是數(shù)據(jù)驅(qū)動(dòng)的架構(gòu)模式,它的UI和數(shù)據(jù)是分離的,所有的頁(yè)面更新,都需要通過對(duì)數(shù)據(jù)的更改來(lái)實(shí)現(xiàn);
-
它從技術(shù)講和現(xiàn)有的前端開發(fā)差不多,采用JavaScript、WXML、WXSS三種技術(shù)進(jìn)行開發(fā);
-
功能可分為webview和appService兩個(gè)部分;
-
webview用來(lái)展現(xiàn)UI,appService有來(lái)處理業(yè)務(wù)邏輯、數(shù)據(jù)及接口調(diào)用;
-
兩個(gè)部分在兩個(gè)進(jìn)程中運(yùn)行,通過系統(tǒng)層JSBridge實(shí)現(xiàn)通信,實(shí)現(xiàn)UI的渲染、事件的處理等。
9 請(qǐng)談?wù)勗_發(fā)小程序、wepy、mpvue 的對(duì)比?
-
個(gè)人認(rèn)為,如果是新項(xiàng)目,且沒有舊的 h5 項(xiàng)目遷移,則考慮用小程序原生開發(fā),好處是相比于第三方框架,坑少。
-
而如果有 老的 h5 項(xiàng)目是 vue 開發(fā) 或者 也有 h5 項(xiàng)目也需要小程序開發(fā),則比較適合 wepy 或者 mpvue 來(lái)做遷移或者開發(fā),近期看wepy幾乎不更新了,所以推薦美團(tuán)的mpvue。
-
而如果如果團(tuán)隊(duì)前端強(qiáng)大,自己做一套框架也沒問題。
10 小程序和原生app哪個(gè)好?
小程序除了擁有公眾號(hào)的低開發(fā)成本、獲客成本低以及無(wú)需下載等優(yōu)勢(shì),在服務(wù)請(qǐng)求延時(shí)與用戶使用體驗(yàn)是都得到了較大幅度的提升,使得其能夠承載跟復(fù)雜的服務(wù)功能以及使用戶獲得更好的用戶體驗(yàn)。
11 簡(jiǎn)述微信小程序原理
微信小程序采用JavaScript、WXML、WXSS三種技術(shù)進(jìn)行開發(fā),從技術(shù)講和現(xiàn)有的前端開發(fā)差不多,但深入挖掘的話卻又有所不同。
JavaScript:首先JavaScript的代碼是運(yùn)行在微信App中的,并不是運(yùn)行在瀏覽器中,因此一些H5技術(shù)的應(yīng)用,需要微信App提供對(duì)應(yīng)的API支持,而這限制住了H5技術(shù)的應(yīng)用,且其不能稱為嚴(yán)格的H5,可以稱其為偽H5,同理,微信提供的獨(dú)有的某些API,H5也不支持或支持的不是特別好。
WXML:WXML微信自己基于XML語(yǔ)法開發(fā)的,因此開發(fā)時(shí),只能使用微信提供的現(xiàn)有標(biāo)簽,HTML的標(biāo)簽是無(wú)法使用的。
WXSS:WXSS具有CSS的大部分特性,但并不是所有的都支持,而且支持哪些,不支持哪些并沒有詳細(xì)的文檔。
微信的架構(gòu),是數(shù)據(jù)驅(qū)動(dòng)的架構(gòu)模式,它的UI和數(shù)據(jù)是分離的,所有的頁(yè)面更新,都需要通過對(duì)數(shù)據(jù)的更改來(lái)實(shí)現(xiàn)。
小程序分為兩個(gè)部分webview和appService。其中webview主要用來(lái)展現(xiàn)UI,appService有來(lái)處理業(yè)務(wù)邏輯、數(shù)據(jù)及接口調(diào)用。它們?cè)趦蓚€(gè)進(jìn)程中運(yùn)行,通過系統(tǒng)層JSBridge實(shí)現(xiàn)通信,實(shí)現(xiàn)UI的渲染、事件的處理
12 微信小程序的雙向綁定和vue哪里不一樣
小程序直接this.data的屬性是不可以同步到視圖的,必須調(diào)用:this.setData({})