1、簡單描述下 微信小程序的相關(guān)文件類型? 答:微信小程序項目結(jié)構(gòu)主要有四個文件類型,如下 一、WXML (WeiXin Markup Language)是框架設(shè)計的一套標簽語言,結(jié)合基礎(chǔ)組件、事件系統(tǒng),
1、簡單描述下****微信小程序的相關(guān)文件類型?
答:微信小程序項目結(jié)構(gòu)主要有四個文件類型,如下
一、WXML (WeiXin Markup Language)是框架設(shè)計的一套標簽語言,結(jié)合基礎(chǔ)組件、事件系統(tǒng),可以構(gòu)建出頁面的結(jié)構(gòu)。內(nèi)部主要是微信自己定義的一套組件。
二、WXSS (WeiXin Style Sheets)是一套樣式語言,用于描述 WXML 的組件樣式,
二、js 邏輯處理,網(wǎng)絡(luò)請求
三、json 小程序設(shè)置,如頁面注冊,頁面標題及tabBar。
四、app.json
必須要有這個文件,如果沒有這個文件,項目無法運行,因為微信框架把這個作為配置文件入口,整個小程序的全局配置。包括頁面注冊,網(wǎng)絡(luò)設(shè)置,以及小程序的window背景色,配置導(dǎo)航條樣式,配置默認標題。
五、app.js
必須要有這個文件,沒有也是會報錯!但是這個文件創(chuàng)建一下就行 什么都不需要寫以后我們可以在這個文件中監(jiān)聽并處理小程序的生命周期函數(shù)、聲明全局變量。
六、app.wxss
2、你是怎么封裝微信小程序的數(shù)據(jù)請求的?
答:
一、將所有的接口放在統(tǒng)一的js文件中并導(dǎo)出
二、在app.js中創(chuàng)建封裝請求數(shù)據(jù)的方法
三、在子頁面中調(diào)用封裝的方法請求數(shù)據(jù)
3、有哪些參數(shù)傳值的方法?
答:
一、給HTML元素添加data-*屬性來傳遞我們需要的值,然后通過e.currentTarget.dataset或onload的param參數(shù)獲取。但data-名稱不能有大寫字母和不可以存放對象
二、設(shè)置id 的方法標識來傳值通過e.currentTarget.id獲取設(shè)置的id的值,然后通過設(shè)置全局對象的方式來傳遞數(shù)值
三、在navigator中添加參數(shù)傳值
4、你使用過哪些方法,來提高微信小程序的應(yīng)用速度?
答:
一、提高頁面加載速度
二、用戶行為預(yù)測
三、減少默認data的大小
四、組件化方案
**5、小程序與原生App哪個好? **
答: 小程序除了擁有公眾號的低開發(fā)成本、低獲客成本低以及無需下載等優(yōu)勢,在服務(wù)請求延時與用戶使用體驗是都得到了較大幅度 的提升,使得其能夠承載跟復(fù)雜的服務(wù)功能以及使用戶獲得更好的用戶體驗。
**6、簡述微信小程序原理? **
答:微信小程序采用JavaScript、WXML、WXSS三種技術(shù)進行開發(fā),從技術(shù)講和現(xiàn)有的前端開發(fā)差不多,但深入挖掘的話卻又有所不同。
JavaScript:首先JavaScript的代碼是運行在微信App中的,并不是運行在瀏覽器中,因此一些H5技術(shù)的應(yīng)用,需要微信App提供對應(yīng)的API支持,而這限制住了H5技術(shù)的應(yīng)用,且其不能稱為嚴格的H5,可以稱其為偽H5,同理,微信提供的獨有的某些API,H5也不支持或支持的不是特別好。
WXML:WXML微信自己基于XML語法開發(fā)的,因此開發(fā)時,只能使用微信提供的現(xiàn)有標簽,HTML的標簽是無法使用的。
WXSS:WXSS具有CSS的大部分特性,但并不是所有的都支持,而且支持哪些,不支持哪些并沒有詳細的文檔。
微信的架構(gòu),是數(shù)據(jù)驅(qū)動的架構(gòu)模式,它的UI和數(shù)據(jù)是分離的,所有的頁面更新,都需要通過對數(shù)據(jù)的更改來實現(xiàn)。
小程序分為兩個部分webview和appService。其中webview主要用來展現(xiàn)UI,appService有來處理業(yè)務(wù)邏輯、數(shù)據(jù)及接口調(diào)用。它們在兩個進程中運行,通過系統(tǒng)層JSBridge實現(xiàn)通信,實現(xiàn)UI的渲染、事件的處理
7、分析下微信小程序的優(yōu)劣勢?
答:
優(yōu)勢:
1、無需下載,通過搜索和掃一掃就可以打開。
2、良好的用戶體驗:打開速度快。
3、開發(fā)成本要比App要低。
4、安卓上可以添加到桌面,與原生App差不多。
5、為用戶提供良好的安全保障。小程序的發(fā)布,微信擁有一套嚴格的審查流程, 不能通過審查的小程序是無法發(fā)布到線上的。
劣勢:
1、限制較多。頁面大小不能超過1M。不能打開超過5個層級的頁面。
2、樣式單一。小程序的部分組件已經(jīng)是成型的了,樣式不可以修改。例如:幻燈片、導(dǎo)航。
3、推廣面窄,不能分享朋友圈,只能通過分享給朋友,附近小程序推廣。其中附近小程序也受到微信的限制。
4、依托于微信,無法開發(fā)后臺管理功能。
8、微信小程序與H5的區(qū)別?
答:
第一條是運行環(huán)境的不同
傳統(tǒng)的HTML5的運行環(huán)境是瀏覽器,包括webview,而微信小程序的運行環(huán)境并非完整的瀏覽器,是微信開發(fā)團隊基于瀏覽器內(nèi)核完全重構(gòu)的一個內(nèi)置解析器,針對小程序?qū)iT做了優(yōu)化,配合自己定義的開發(fā)語言標準,提升了小程序的性能。
第二條是開發(fā)成本的不同
只在微信中運行,所以不用再去顧慮瀏覽器兼容性,不用擔(dān)心生產(chǎn)環(huán)境中出現(xiàn)不可預(yù)料的奇妙BUG
第三條是獲取系統(tǒng)級權(quán)限的不同
系統(tǒng)級權(quán)限都可以和微信小程序無縫銜接
第四條便是應(yīng)用在生產(chǎn)環(huán)境的運行流暢度
長久以來,當(dāng)HTML5應(yīng)用面對復(fù)雜的業(yè)務(wù)邏輯或者豐富的頁面交互時,它的體驗總是不盡人意,需要不斷的對項目優(yōu)化來提升用戶體驗。但是由于微信小程序運行環(huán)境獨立
9、怎么解決小程序的異步請求問題?
答:
在回調(diào)函數(shù)中調(diào)用下一個組件的函數(shù):
app.js
success: function (info) {
that.apirtnCallback(info) }
index.js
onLoad: function () {
app.apirtnCallback = res => {
console.log(res)
}
}
10、小程序的雙向綁定和vue哪里不一樣?
答:
小程序直接this.data的屬性是不可以同步到視圖的,必須調(diào)用:
this.setData({
noBind:true
})
11、小程序的wxss和css有哪些不一樣的地方?
答:一、wxss的圖片引入需使用外鏈地址;二、沒有Body;樣式可直接使用import導(dǎo)入
12、webview中的頁面怎么跳回小程序中?
答:首先要引入最新版的jweixin-1.3.2.js,然后
wx.miniProgram.navigateTo({
url: '/pages/login/login'+'$params' })
13、小程序關(guān)聯(lián)微信公眾號如何確定用戶的****唯一性?
答:使用wx.getUserInfo方法withCredentials為 true 時 可獲取encryptedData,里面有 union_id。后端需要進行對稱解密
14、如何實現(xiàn)下拉刷新****?
答:用view代替scroll-view,,設(shè)置onPullDownRefresh函數(shù)實現(xiàn)
15、使用webview直接加載要注意哪些事項****?
答:一、必須要在小程序后臺使用管理員添加業(yè)務(wù)域名;二、h5頁面跳轉(zhuǎn)至小程序的腳本必須是1.3.1以上;三、微信分享只可以都是小程序的主名稱了,如果要自定義分享的內(nèi)容,需小程序版本在1.7.1以上;四、h5的支付不可以是微信公眾號的appid,必須是小程序的appid,而且用戶的openid也必須是用戶和小程序的。
16、小程序調(diào)用后臺接口遇到哪些問題****?
答:一、數(shù)據(jù)的大小有限制,超過范圍會直接導(dǎo)致整個小程序崩潰,除非重啟小程序;2、小程序不可以直接渲染文章內(nèi)容頁這類型的html文本內(nèi)容,若需顯示要借住插件,但插件渲染會導(dǎo)致頁面加載變慢,所以最好在后臺對文章內(nèi)容的html進行過濾,后臺直接處理批量替換p標簽div標簽為view標簽,然后其它的標簽讓插件來做,減輕前端的時間。
17、webview的頁面怎么跳轉(zhuǎn)到小程序?qū)Ш降捻撁妫?/strong>
答:小程序?qū)Ш降捻撁婵梢酝ㄟ^switchTab,但默認情況是不會重新加載數(shù)據(jù)的。
若需加載新數(shù)據(jù),則在success屬性中加入以下代碼即可:
success: function (e) {
var page = getCurrentPages().pop();
if (page == undefined || page == null) return;
page.onLoad();
}
webview的頁面,則通過
wx.miniProgram.switchTab({
url: '/pages/index/index'
})
18、小程序和Vue寫法的區(qū)別?
答:
一、循環(huán)遍歷的時候:小程序是wx:for="list",而Vue是v-for="info in list"
二、調(diào)用data模型的時候:小程序是this.data.uinfo,而Vue是this.uinfo;給模型賦值也不一樣,小程序是this.setData({uinfo:1}),而Vue是直接this.uinfo=1