uniapp面試題

1.生命周期

1.1應(yīng)用的生命周期

1.onLaunch ——當(dāng)uni-app 初始化完成時(shí)觸發(fā)(全局只觸發(fā)一次)

2.onShow——當(dāng) uni-app 啟動(dòng),或從后臺(tái)進(jìn)入前臺(tái)顯示

3.onHide——當(dāng) uni-app 從前臺(tái)進(jìn)入后臺(tái)

4.onError——當(dāng) uni-app 報(bào)錯(cuò)時(shí)觸發(fā)

5.onUniNViewMessage——對(duì) nvue 頁(yè)面發(fā)送的數(shù)據(jù)進(jìn)行監(jiān)聽(tīng),可參考 nvue 向 vue 通訊

6.onUnhandledRejection——對(duì)未處理的 Promise 拒絕事件監(jiān)聽(tīng)函數(shù)(2.8.1+)

7.onPageNotFound——頁(yè)面不存在監(jiān)聽(tīng)函數(shù)

8.onThemeChange——監(jiān)聽(tīng)系統(tǒng)主題變化?

? ?1.2頁(yè)面的生命周期

1.onInit——監(jiān)聽(tīng)頁(yè)面初始化,其參數(shù)同 onLoad 參數(shù),為上個(gè)頁(yè)面?zhèn)鬟f的數(shù)據(jù),參數(shù)類型為Object(用于頁(yè)面?zhèn)鲄ⅲ?,觸發(fā)時(shí)機(jī)早于 onLoad

2.onLoad——監(jiān)聽(tīng)頁(yè)面加載,其參數(shù)為上個(gè)頁(yè)面?zhèn)鬟f的數(shù)據(jù),參數(shù)類型為Object(用于頁(yè)面?zhèn)鲄ⅲ?,參考示?/p>

3.onShow——監(jiān)聽(tīng)頁(yè)面顯示。頁(yè)面每次出現(xiàn)在屏幕上都觸發(fā),包括從下級(jí)頁(yè)面點(diǎn)返回露出當(dāng)前頁(yè)面4.onReady——監(jiān)聽(tīng)頁(yè)面初次渲染完成。注意如果渲染速度快,會(huì)在頁(yè)面進(jìn)入動(dòng)畫(huà)完成前觸發(fā)

5.onHide——監(jiān)聽(tīng)頁(yè)面隱藏

6.onUnload——監(jiān)聽(tīng)頁(yè)面卸載

7.onResize——監(jiān)聽(tīng)窗口尺寸變化

1.3組件的生命周期

1.beforeCreate——在實(shí)例初始化之后被調(diào)用。

2.created——在實(shí)例創(chuàng)建完成后被立即調(diào)用。

3.beforeMount——在掛載開(kāi)始之前被調(diào)用。

4.mounted——掛載到實(shí)例上去之后調(diào)用。詳見(jiàn) 注意:此處并不能確定子組件被全部掛載,如果需要子組件完全掛載之后在執(zhí)行操作可以使用$nextTickVue官方文檔

5.beforeUpdate——數(shù)據(jù)更新時(shí)調(diào)用,發(fā)生在虛擬DOM打補(bǔ)丁之前。

6.updated——由于數(shù)據(jù)更改導(dǎo)致的虛擬DOM重新渲染和打補(bǔ)丁,在這之后會(huì)調(diào)用該鉤子。

7.beforeDestroy——實(shí)例銷毀之前調(diào)用。在這一步,實(shí)例仍然完全可用。

8.destroyed——Vue實(shí)例銷毀后調(diào)用。調(diào)用后,Vue實(shí)例指示的所有東西都會(huì)解綁定,所有的事件監(jiān)聽(tīng)器會(huì)被移除,所有的子實(shí)例也會(huì)被銷毀。

?2.Uniapp中的本地緩存

同步存儲(chǔ):uni.setStorageSync獲取:uni.getStorageSync異步存儲(chǔ):uni.setStorage獲?。簎ni.getStorage

3.Uniapp 中的路由跳轉(zhuǎn)

uni.navigateTo({url:})保留當(dāng)前頁(yè)面,只能打開(kāi)非 tabBar 頁(yè)面。

uni.redirectTo({})關(guān)閉卸載當(dāng)前頁(yè)面,只能打開(kāi)非 tabBar 頁(yè)面

uni.switchTab打開(kāi) tabBar 頁(yè)面,不能url傳參

uni.reLaunch({})關(guān)閉卸載所有頁(yè)面,可以打開(kāi)任意頁(yè)面

4.條件編譯

#ifdef:ifdefined 僅在某平臺(tái)存在

#ifndef:ifnot defined 除了某平臺(tái)均存在

%PLATFORM%:平臺(tái)名稱

5.uniapp的配置文件、入口文件、主組件、頁(yè)面管理部

pages.json

配置文件,全局頁(yè)面路徑配置,應(yīng)用的狀態(tài)欄、導(dǎo)航條、標(biāo)題、窗口背景色設(shè)置等

main.js

入口文件,主要作用是初始化vue實(shí)例、定義全局組件、使用需要的插件如 vuex,注意uniapp無(wú)法使用vue-router,路由須在pages.json中進(jìn)行配置。如果開(kāi)發(fā)者堅(jiān)持使用vue-router,可以在插件市場(chǎng)找到轉(zhuǎn)換插件。

App.vue

是uni-app的主組件,所有頁(yè)面都是在App.vue下進(jìn)行切換的,是頁(yè)面入口文件。但App.vue本身不是頁(yè)面,這里不能編寫(xiě)視圖元素。除此之外,應(yīng)用生命周期僅可在App.vue中監(jiān)聽(tīng),在頁(yè)面監(jiān)聽(tīng)無(wú)效。

pages

頁(yè)面管理部分用于存放頁(yè)面或者組件

manifest.json

文件是應(yīng)用的配置文件,用于指定應(yīng)用的名稱、圖標(biāo)、權(quán)限等。HBuilderX 創(chuàng)建的工程此文件在根目錄,CLI 創(chuàng)建的工程此文件在 src 目錄。

package.json

配置擴(kuò)展,詳情內(nèi)容請(qǐng)見(jiàn)官網(wǎng)描述package.json概述

全局變量globalData的理解

globalDate和微信小程序中一樣,是定義在全局上的對(duì)象,他類似于vuex,用來(lái)共享全局狀態(tài),在組件和頁(yè)面中可以使用getApp().globalData來(lái)獲取和修改全局變量。

//app.vue

<script>

? ? export default {

? ? ? ? globalData: {

? ? ? ? ? ? msg: 'hello world'

? ? ? ? }

? ? }

</script>

//在其他頁(yè)面調(diào)用/修改全局變量

getApp().globalData.msg= 'hello world'


6.rpx、px、em、rem、%、vh、vw的區(qū)別是什么?

rpx 相當(dāng)于把屏幕寬度分為750份,1份就是1rpxpx 絕對(duì)單位,頁(yè)面按精確像素展示em 相對(duì)單位,相對(duì)于它的父節(jié)點(diǎn)字體進(jìn)行計(jì)算rem 相對(duì)單位,相對(duì)根節(jié)點(diǎn)html的字體大小來(lái)計(jì)算% 一般來(lái)說(shuō)就是相對(duì)于父元素vh 視窗高度,1vh等于視窗高度的1%vw 視窗寬度,1vw等于視窗寬度的1%

7.頁(yè)面樣式兼容

1.在ios鍵盤(pán)中首字母大寫(xiě)的問(wèn)題??

<input type="text" autocapitalize='off'>

2. ios日期轉(zhuǎn)換NAN問(wèn)題

? ? ? ? 具體就是,new Date('2020-11-12 00:00:00')在ios中會(huì)為NAN

? ? ? ? 解決方案:用new Date('2020/11/12 00:00:00')的日期格式,或者寫(xiě)個(gè)正則轉(zhuǎn)換

3. 在移動(dòng)端使用click事件有300ms延遲的問(wèn)題

? ? ? ? 禁止雙擊縮放===》meta:user-scalabel=no

4. 移動(dòng)端touch事件有穿透(點(diǎn)透)的問(wèn)題,怎么解決?

? ? ? ? 4.1 阻止默認(rèn)行為 : e.preventDefault();

? ? ? ? 4.2 fastclick.js

5. 安卓部分版本input的placeholder偏上

? ? ? ? input{

? ? ? ? ? ? ? line-height:normal;

? ? ? ? }

2. ios日期轉(zhuǎn)換NAN問(wèn)題? ? ? ? 具體就是,new Date('2020-11-12 00:00:00')在ios中會(huì)為NAN? ? ? ? 解決方案:用new Date('2020/11/12 00:00:00')的日期格式,或者寫(xiě)個(gè)正則轉(zhuǎn)換

3. 在移動(dòng)端使用click事件有300ms延遲的問(wèn)題? ? ? ? ?禁止雙擊縮放===》meta:user-scalabel=no4. 移動(dòng)端touch事件有穿透(點(diǎn)透)的問(wèn)題,怎么解決?? ? ? ??

?7 阻止默認(rèn)行為 : e.preventDefault();? ? ? ? ?4.2 fastclick.js5. 安卓部分版本input的placeholder偏上? ? ? ? input{? ? ? ? ? ? ? ?line-height:normal;? ? ? ? }

8.uniapp獲取地理位置的API是什么?

uni.getLocation

16.請(qǐng)簡(jiǎn)要介紹一下UniApp中的導(dǎo)航欄組件。

在UniApp中,導(dǎo)航欄組件用于實(shí)現(xiàn)頁(yè)面的頂部導(dǎo)航欄,并提供了一些常用的配置選項(xiàng)。

UniApp中常見(jiàn)的導(dǎo)航欄組件是uni-navigator,它可以在頁(yè)面中嵌入導(dǎo)航欄,并通過(guò)屬性進(jìn)行配置。以下是uni-navigator組件的一些常用屬性:

title:指定導(dǎo)航欄標(biāo)題文字。

color:設(shè)置導(dǎo)航欄文字顏色。

background-color:設(shè)置導(dǎo)航欄背景顏色。

back-icon:設(shè)置返回按鈕的圖標(biāo)樣式。

home-icon:設(shè)置首頁(yè)按鈕的圖標(biāo)樣式。

float:設(shè)置導(dǎo)航欄是否浮動(dòng)(懸浮模式),用于實(shí)現(xiàn)下拉時(shí)導(dǎo)航欄顯示或隱藏。

除了uni-navigator組件,UniApp還提供了其他導(dǎo)航相關(guān)的組件,如:

uni-NavBar:適用于App端的導(dǎo)航欄組件,提供了更多的定制化和交互功能。

uni-tab-bar:底部導(dǎo)航欄組件,用于實(shí)現(xiàn)多個(gè)頁(yè)面之間的切換。

uni-segmented-control:分段器組件,用于實(shí)現(xiàn)頁(yè)面內(nèi)的切換導(dǎo)航。

通過(guò)使用這些導(dǎo)航欄組件,可以在UniApp中輕松地創(chuàng)建和配置導(dǎo)航功能,提升應(yīng)用程序的用戶體驗(yàn)。

uniapp 中的路由是怎樣實(shí)現(xiàn)的?請(qǐng)介紹基本用法。

Uniapp 中的路由是由框架自帶的 Vue Router 實(shí)現(xiàn)的?;居梅ㄈ缦拢?/p>

在 pages.json 文件中配置頁(yè)面路徑和需要加載的頁(yè)面組件。

在頁(yè)面組件中使用 &lt;template>、&lt;script> 和 &lt;style> 標(biāo)簽,其中 &lt;template> 標(biāo)簽中是頁(yè)面的內(nèi)容,&lt;script> 標(biāo)簽中定義頁(yè)面組件的相關(guān)屬性,&lt;style> 標(biāo)簽中定義頁(yè)面的樣式。

使用 uni.navigateTo() 或 uni.redirectTo() 方法進(jìn)行頁(yè)面跳轉(zhuǎn)。

uni.navigateTo() 方法用于從當(dāng)前頁(yè)面跳轉(zhuǎn)到新頁(yè)面,并向新頁(yè)面?zhèn)鬟f數(shù)據(jù),即保留當(dāng)前頁(yè)面,跳轉(zhuǎn)到新頁(yè)面。新頁(yè)面可以通過(guò) uni.getOpenerEventChannel() 獲取當(dāng)前頁(yè)面的 EventChannel 對(duì)象,以便進(jìn)行數(shù)據(jù)傳遞。

uni.redirectTo() 方法用于關(guān)閉當(dāng)前頁(yè)面,跳轉(zhuǎn)到新頁(yè)面,即不保留當(dāng)前頁(yè)面。

在頁(yè)面組件中使用 this.$route.params 獲取上一個(gè)頁(yè)面?zhèn)鬟f的參數(shù),并使用 this.$route.query 獲取頁(yè)面跳轉(zhuǎn)時(shí)傳遞的參數(shù)。

使用 uni.navigateBack() 方法返回上一個(gè)頁(yè)面,可以通過(guò) delta 參數(shù)設(shè)置返回的層數(shù)。

除了基本用法,還可以通過(guò)路由守衛(wèi)實(shí)現(xiàn)一些高級(jí)用法,例如頁(yè)面訪問(wèn)權(quán)限控制、頁(yè)面訪問(wèn)記錄等。


9.分包

因小程序有體積和資源加載限制,各家小程序平臺(tái)提供了分包方式,優(yōu)化小程序的下載和啟動(dòng)速度。所謂的主包,即放置默認(rèn)啟動(dòng)頁(yè)面及TabBar頁(yè)面,而分包則是根據(jù) pages.json的配置進(jìn)行劃分。在小程席啟動(dòng)時(shí),默認(rèn)會(huì)下載主包并啟動(dòng)主包內(nèi)頁(yè)面,當(dāng)用戶進(jìn)入分包內(nèi)某個(gè)頁(yè)面時(shí),會(huì)把對(duì)應(yīng)分包自動(dòng)下載下來(lái),下載完成后再進(jìn)行展示,此時(shí)終端界面會(huì)有等待提示。subPackages":[

"root":"news"

"pages":[(

"path":"index"

style":"navigationBarTitleText":“新聞中心"

"navigationBarBackgroundColor":“#FFFFFF""navigationBarTextStyle":"black","backgroundColor":"#FFFFFF"

10.獲取當(dāng)前用戶的手機(jī)信息

uni-app提供了異步( uni.getsystemInfo)和同步( unigetsystemInfosync )的2個(gè)API獲取系統(tǒng)信息。系統(tǒng)信息返回的內(nèi)容非常多,各操作系統(tǒng)、各家小程序、各瀏覽器對(duì)它們的定義也不相同。un-app里重新梳理了這些念,同時(shí)為了向下兼容也保留了這些平臺(tái)原來(lái)的概念,但不推薦使用。按照運(yùn)行環(huán)境層級(jí)排序,從底層向上,uni-app有6個(gè)概念: device(抵歪絲) : 運(yùn)行應(yīng)用的設(shè)備,如iphone、huawei os : 設(shè)備的操作系統(tǒng),如 ios、andriod、windows、 mac、 linux rom : 基于操作系統(tǒng)的定制,Android系統(tǒng)特有概念,如miui、鴻蒙 host :運(yùn)行應(yīng)用的宿主程序,即OS和應(yīng)用之間的運(yùn)行環(huán)境,如瀏覽器、微信等小程序宿主、集成uniMPSDK的App,un-app直接開(kāi)發(fā)的app沒(méi)有host概念 uni : uniapp框架相關(guān)的信息,如uni-app框架的編譯器版本、運(yùn)行時(shí)版本 app : 開(kāi)發(fā)者的應(yīng)用相關(guān)的信息,如應(yīng)用名稱、版本

12.監(jiān)聽(tīng)到下拉刷新的動(dòng)作

需要用到uni.onPullDownRefresh和uni.stopPullDownRefresh這兩個(gè)函數(shù),函數(shù)與生命周期同等級(jí)可以監(jiān)聽(tīng)頁(yè)面下拉動(dòng)作

13.uniapp實(shí)現(xiàn)上拉加載

uniapp中的上拉加載是通過(guò)onReachBottom()這個(gè)生命周期函數(shù)實(shí)現(xiàn),當(dāng)下拉觸底時(shí)就會(huì)觸發(fā)。我們可以在此函數(shù)內(nèi)調(diào)用分頁(yè)接口請(qǐng)求數(shù)據(jù),用以獲取更多的數(shù)據(jù)

14. 在Uniapp中,如何使用原生SDK以及插件?

在Uniapp中,可通過(guò)uni-app plus的方式來(lái)集成原生SDK和插件。具體實(shí)現(xiàn)方式是,在manifest.json文件中添加對(duì)應(yīng)的插件設(shè)置,并在代碼中調(diào)用相關(guān)API使用內(nèi)置的SDK和插件。15. 描述一下在Uniapp中如何實(shí)現(xiàn)動(dòng)態(tài)路由。在Uniapp中,可通過(guò)vue-router實(shí)現(xiàn)動(dòng)態(tài)路由。具體實(shí)現(xiàn)方式是,在定義路由時(shí),使用動(dòng)態(tài)路由參數(shù)設(shè)置路由的路徑,然后在組件中通過(guò)$route.params來(lái)獲取路由參數(shù),以便進(jìn)行頁(yè)面的動(dòng)態(tài)渲染。


15.小程序的發(fā)布流程(開(kāi)發(fā)流程)

1.申請(qǐng)注冊(cè)微信小程序賬號(hào),注意:注冊(cè)賬號(hào)之后會(huì)有一個(gè)AppID,下載微信開(kāi)發(fā)者工具,新建項(xiàng)目的時(shí)候需要填上,否則很多功能用不了,比如不能預(yù)覽、不能上傳代碼等問(wèn)題。

2.通過(guò)微信開(kāi)發(fā)工具新建項(xiàng)目。

3.根據(jù)業(yè)務(wù)需求配置小程序,并進(jìn)行業(yè)務(wù)代碼的開(kāi)發(fā)。

4.如果涉及到發(fā)送請(qǐng)求,需要在小程序后臺(tái)管理頁(yè)面配置服務(wù)器合法域名,或者關(guān)閉域名校驗(yàn)(部署則必須配置合法域名,域名必須是https協(xié)議的,并且已經(jīng)備案了)(這里有可能問(wèn)http和https的區(qū)別)

5.開(kāi)發(fā)完成之后點(diǎn)擊上傳代碼可以將小程序發(fā)不到體驗(yàn)版

6.體驗(yàn)版確定無(wú)誤后提交審核,審核通過(guò)后就可以正式上線了。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容