小程序面試
小程序相關文件
wxml 模版文件欠母,是框架設計的一套標簽語言,結合基礎組件赂弓,事件系統(tǒng)可以構建出頁面結構
wxss 樣式文件
js 腳本邏輯文件
json 配置文件
wxss 和 css 的區(qū)別
wxss 背景圖片只能外鏈或者base64
使用 @import 相對路徑引入外聯(lián)樣式
尺寸為rpx已卷,rpx是響應式像素朵逝,根據(jù)屏幕寬度自適應萌业,默認是1px=2rpx
wxss只支持部分css選擇器
小程序的雙向綁定和vue有什么不一樣
小程序需要借助data坷襟,取值的時候要this.data,賦值如果不用setData不會觸發(fā)視圖更新生年,vue直接this就行
小程序的生命周期
onLoad onShow onReady onHide onUnload
怎么實現(xiàn)下拉刷新
配置app.json或者配置組件的婴程,enablePullDownRefresh 開啟下拉刷新,頁面用onPullDownRefresh函數(shù)處理
再或者使用scroll-view, 自定義刷新通過bindscrolltoupper
bindtap 和 catchtap 的區(qū)別
都是點擊事件抱婉,catchtap能阻止冒泡
有哪些傳遞數(shù)據(jù)的方法
路由添加url參數(shù)
全局變量
組件模版?zhèn)鬟f
本地緩存
數(shù)據(jù)庫傳遞
說下wx.navigateTo()档叔,wx.redirectTo(),wx.switchTab()蒸绩, wx.navigateBack()衙四,wx.reLaunch()區(qū)別
wx.navigateTo() 保留當前頁面,跳轉到應用內某個頁面患亿,但是不能跳tabbar頁面
wx.redirectTo() 關閉當前頁面传蹈,跳轉到應用內某個頁面,也是不能跳tabbar頁面
wx.switchTab() 跳轉到tabbar頁面步藕,關閉其他所有非tabbar頁面
wx.navigateBack() 關閉當前頁面惦界,返回上一頁或多級頁面,可通過getCurrentPages()獲取當前頁面棧咙冗,決定需要返回幾層
wx.reLaunch() 關閉所有頁沾歪,打開某個頁
小程序wx:if 和 hidden 的區(qū)別
wx:if 是隱藏時不渲染,hidden一直都渲染
wx:if 有更高的切換消耗乞娄,不頻繁切換用hidden
app.json 描述
pages 路由瞬逊,頁面路徑
window 頁面頂部配置,背景仪或,文字啥的
tabbar 底欄配置,最多5個士骤,最少2個
封裝請求
把wx.request請求封裝范删,然后封裝post,get啥的常用的方法,最后導出
建一個api.js拷肌,導入封裝的方法到旦,調取相應的方法,傳遞參數(shù)
在頁面中調用api.js
小程序相關文件類型
project.config.json 項目配置
App.js 全局變量巨缘,小程序生命周期
App.json 頁面路徑添忘,頂部配置,底欄配置
App.wxss 全局樣式
pages 放頁面
index.json 頁面配置
index.wxml 頁面
index.js 頁面js
index.wxss 頁面樣式
wxml 和 html 區(qū)別
都是描述頁面結構的
都有標簽和屬性
標簽名字不一樣若锁,wxml標簽少搁骑,單一標簽多
多了一些wx:if的屬性和{{}}
wxml只能在微信開發(fā)者工具預覽,html瀏覽器就行
組件封裝不同,wxml對組件重新封裝
小程序里沒有DOM和window仲器,用不了window和document
小程序原理
本質是單頁面應用煤率,通過微信調用原生接口
是數(shù)據(jù)驅動架構,視圖和數(shù)據(jù)是分離的乏冀,通過數(shù)據(jù)更新視圖
功能分為webview和appservice蝶糯,webview是視圖,appservice是業(yè)務辆沦,數(shù)據(jù)和接口調用
在兩個進程中運行昼捍,通過系統(tǒng)的JSBridge實現(xiàn)通信,渲染和事件處理
小程序優(yōu)化
去掉沒用的代碼肢扯,減少小程序體積
減少靜態(tài)資源文件
復雜邏輯在后端實現(xiàn)
組件和邏輯復用
分包加載
部分頁面H5
啟用本地緩存
數(shù)據(jù)預拉取
跳轉預拉取
懶加載
接口聚合
圖片資源優(yōu)化
添加骨架屏
減少data數(shù)據(jù)量端三,層級深度
去掉多余的節(jié)點屬性和事件
用事件總線替代數(shù)據(jù)綁定的通信方式,用發(fā)布/訂閱模式完成父向子的數(shù)據(jù)傳遞
onPageScroll事件回調使用節(jié)流
小程序優(yōu)劣勢
優(yōu)勢
容易上手鹃彻,基礎組件庫全郊闯,基本上不用考慮接口兼容
開發(fā)文檔完善,社區(qū)活躍蛛株,支持插件開發(fā)
用戶體驗好团赁,不用下載,即用即走谨履,運行速度快欢摄,依靠微信流量
連接線上線下
開發(fā)成本比app低
劣勢
限制較多,頁面大小不能超過1M笋粟,不能打開超過5個層級頁面
樣式單一怀挠,部分組件不能修改,比如幻燈片
需要審核上架害捕,比較麻煩
留存不好绿淋,只能在微信里用
小程序調用接口有哪些問題
返回數(shù)據(jù)大了可能會導致奔潰
小程序不支持html內容直接渲染,需要借助插件
在webview里跳回小程序
wx.miniProgram.navigateTo()
wx.miniProgram.switchTab()
小程序和H5的區(qū)別
運行環(huán)境不一樣
開發(fā)成本不一樣
獲取系統(tǒng)權限不一樣
運行流暢度不一樣
小程序發(fā)布要審核
小程序和app的區(qū)別
限制在微信里尝盼,開發(fā)周期短吞滞,功能少,占用空間少
支付流程
獲取臨時憑證盾沫,獲取wxid
生成repayid裁赠,返回json
小程序調用支付接口,支付成功提示和回調后端
自定義tabbar
取消原有tabbar
創(chuàng)建tabbar組件
在app.json里配置tabBar的custom設置true
在tab頁的json配置usingComponents赴精,也可以在app.json里全局開啟
小程序里用閉包
有些函數(shù)是異步的佩捞,如果函數(shù)里有循環(huán),不使用閉包最后結果都一樣
小程序和vue寫法的區(qū)別
小程序里 wx:for
vue v-for=" in "
小程序通過data取數(shù)據(jù)蕾哟,通過setData賦值
vue直接this就行