1昧捷,簡述你對微信小程序的目錄結(jié)構(gòu)的理解撕贞?
project.config.json : 這是一個項目配置文件耙旦,比如項目的名字唆涝,appid等等
app.js: app.js文件用來定義全局?jǐn)?shù)據(jù)和函數(shù)的使用找都,它可以指定微信小程序的生命周期函數(shù)。生命周期函數(shù)可以理解為微信小程序自己定義的函數(shù)廊酣,如onlaunch(監(jiān)聽小程序初始化)能耻,onshow(監(jiān)聽小程序顯示),onhide(監(jiān)聽小程序隱藏)等,在不同階段亡驰,不同場景可以使用不同的生命周期函數(shù)晓猛。app.js中還可以定義一些全局的函數(shù)和數(shù)據(jù),其他頁面引用app.js文件后就可以直接使用全局函數(shù)和數(shù)據(jù)
app.json: : app.json 是當(dāng)前小程序的全局配置凡辱,包括了小程序的所有頁面路徑戒职、界面表現(xiàn)、網(wǎng)絡(luò)超時時間透乾、底部 tab 等;我們可以在這個文件中配置小程序是由哪些頁面組成帕涌,配置小程序的窗口及背景色,配置導(dǎo)航條樣式续徽,配置默認(rèn)標(biāo)題蚓曼。注意該文件不可添加任何注釋
app.wxss: app.wxss則是小程序的全局樣式,它可以應(yīng)用到所有page頁面钦扭。
pages: 主要存放小程序的頁面文件纫版,書寫各個頁面代碼以及組件,每個頁面包含四個文件:
js文件:.js是小程序的邏輯文件客情,也稱事件交互文件和腳本文件其弊,用于處理界面的點(diǎn)擊事件等功能,像設(shè)置初始數(shù)據(jù)膀斋,定義事件梭伐,數(shù)據(jù)的交互,邏輯的運(yùn)算仰担,變量的聲明糊识,數(shù)組,對象,函數(shù)赂苗,注釋的方式等愉耙,其語法與javascript相同
wxml文件:.wxml文件是界面文件,是頁面結(jié)構(gòu)文件拌滋,用于構(gòu)建頁面朴沿,在頁面上增加控件,相當(dāng)于html败砂。
wxss文件:.wxss是樣式表文件赌渣,類似于前端中的css,是為.wxml文件和page文件進(jìn)行美化的文件昌犹,讓界面顯示的更加美觀锡垄。例如對文字的大小,顏色祭隔,圖片的寬高,設(shè)置個.wxml中個組件的位置路操,間距等疾渴。
json文件:json后綴的文件為配置當(dāng)前頁面的默認(rèn)項,主要是json數(shù)據(jù)格式存放屯仗,用于設(shè)置程序的配置效果
utils :該文件件主要用于存放全局的一些.js文件搞坝,公共用到的一些事件處理代碼文件可以放到該文件夾下,用于全局調(diào)用
sitemap.json 小程序根目錄下的 sitemap.json 文件用于配置小程序及其頁面是否允許被微信索引魁袜,文件內(nèi)容為一個 JSON 對象桩撮,如果沒有 sitemap.json ,則默認(rèn)為所有頁面都允許被索引峰弹。
2,微信小程序的生命周期
答案:
onLoad: 頁面加載
一個頁面只會調(diào)用一次店量。
接收頁面參數(shù) 可以獲取wx.navigateTo和wx.redirectTo及<navigator/>中的 query。
onShow: 頁面顯示
每次打開頁面都會調(diào)用一次鞠呈。
onReady: 頁面初次渲染完成
一個頁面只會調(diào)用一次融师,代表頁面已經(jīng)準(zhǔn)備妥當(dāng),可以和視圖層進(jìn)行交互蚁吝。
onHide: 頁面隱藏
當(dāng)navigateTo或底部tab切換時調(diào)用旱爆。
onUnload: 頁面卸載
當(dāng)redirectTo或navigateBack的時候調(diào)用。
知識點(diǎn)鏈接:https://www.cnblogs.com/nosqlcoco/p/wxsmallcycle.html
3窘茁,微信小程序里面開頁面最多多少怀伦?
答案:小程序中頁面棧最多十層,隨著頁面增加路由跳轉(zhuǎn)很容易在不知道的情況下就會堆棧到十層山林,再用navigateTo去跳轉(zhuǎn)就跳不動了房待。假如想處理小程序頁面棧,這時候就需要刪除當(dāng)前頁面棧(redirectTo)或刪除所有頁面棧(reLaunch)來跳轉(zhuǎn)了。頁面椢庠埽可以通過getCurrentPages方法獲取张抄。
4,組件component如何使用到父級頁面的樣式洼怔?
答案:
子組件:
/* 組件 custom-component.js */
Component({externalClasses:['my-class']})
<custom-componentclass="my-class">這段文本的顏色由組件外的 class 決定</custom-component>
父組件:
<custom-componentmy-class="red-text"/>
/* 頁面的 WXSS */.red-text{color:red;}
4署惯,微笑小程序如何下拉刷新,如果讓你自己手寫一個镣隶,你講如何設(shè)計极谊?
答案:調(diào)用系統(tǒng)的API,系統(tǒng)有提供下拉刷新的API接口--"enablePullDownRefresh": true
6安岂,微信小程序中頁面跳轉(zhuǎn)的方式有什么轻猖?
答案:
wx.navigateTo(),跳轉(zhuǎn)至另一個頁面
wx.switchTab(),跳轉(zhuǎn)至tabbar頁
wx.redirectTo()域那,跳轉(zhuǎn)至另一界面咙边,如下圖,與wx.navigateTo()不同的是wx.redirectTo()跳轉(zhuǎn)后的頁面沒有返回箭頭次员,如果需要返回需自定義返回按鈕
知識點(diǎn)鏈接:https://www.cnblogs.com/Webzhoushifa/p/9510226.html