小程序最近是越來(lái)越火了……
創(chuàng)新互聯(lián)建站網(wǎng)站建設(shè)公司是一家服務(wù)多年做網(wǎng)站建設(shè)策劃設(shè)計(jì)制作的公司,為廣大用戶提供了做網(wǎng)站、網(wǎng)站設(shè)計(jì),成都網(wǎng)站設(shè)計(jì),廣告投放平臺(tái),成都做網(wǎng)站選創(chuàng)新互聯(lián)建站,貼合企業(yè)需求,高性價(jià)比,滿足客戶不同層次的需求一站式服務(wù)歡迎致電。做小程序有一段時(shí)間了,總結(jié)一下項(xiàng)目中遇到的問(wèn)題及解決辦法吧。
項(xiàng)目中有個(gè)多 tab 嵌套的需求,進(jìn)入程序主界面下面有兩個(gè) tab,進(jìn)入A模塊后,A模塊最底下又有多個(gè)tab,每個(gè)tab上又嵌了2-4個(gè)不等的tab。。。
這種變態(tài)需求只能自定義tab了。
其實(shí)如果項(xiàng)目不是很復(fù)雜,沒(méi)有多tab嵌套的需求,完全可以用小程序官方的 tabBar,方便快捷。
官方 tabBar 地址:https://developers.weixin.qq....
一、Demo結(jié)構(gòu)
先看效果圖吧
結(jié)構(gòu)是這樣的:程序主界面包含兩個(gè) tab:主頁(yè)和我的,主頁(yè)又包含兩個(gè)tab:最熱和最新;我的也包含兩個(gè)tab:電影和音樂(lè)。
關(guān)系圖如下:
項(xiàng)目
主頁(yè)
最熱
最新
我的
電影
音樂(lè)
二、開(kāi)始擼代碼
再看代碼結(jié)構(gòu)
兩種頁(yè)面結(jié)構(gòu)
小程序的頁(yè)面分為兩種:page 和 components。
page就是普通的頁(yè)面, components是小程序?yàn)閷?shí)現(xiàn)模塊化而提供的自定義組件。
相同點(diǎn):
都由四個(gè)文件:.js、.json、.wxml、.wxss、構(gòu)成,.wxml、.wxss寫法完全相同。
不同點(diǎn):
components要在json文件中注明:"component": true
{ "component": true, "usingComponents": { "movie": "movie/movie", "music": "music/music" } }