微信小程序的tabbar就是一個(gè)選項(xiàng)卡的設(shè)置。在本文中，將分享一下微信小程序設(shè)置tabbar的經(jīng)驗(yàn)。 1. 設(shè)置tab選項(xiàng)卡 首先，在微信小程序下面設(shè)置兩個(gè)tab選項(xiàng)卡?？梢酝ㄟ^(guò)右邊的小程序文件夾

微信小程序的tabbar就是一個(gè)選項(xiàng)卡的設(shè)置。在本文中，將分享一下微信小程序設(shè)置tabbar的經(jīng)驗(yàn)。

1. 設(shè)置tab選項(xiàng)卡

首先，在微信小程序下面設(shè)置兩個(gè)tab選項(xiàng)卡?？梢酝ㄟ^(guò)右邊的小程序文件夾中找到index以及l(fā)ogs選項(xiàng)。在tab配置時(shí)，必須設(shè)置路由頁(yè)面為其中一個(gè)才能顯示。

2. 在app.json中配置tabbar組件

在app.json文件中輸入"tab"即可感應(yīng)到tabbar組件。回車后，會(huì)自動(dòng)完整輸入整個(gè)tabbar組件。

tabbar組件中有一個(gè)list數(shù)組，用來(lái)存放tabbar的個(gè)數(shù)。每對(duì)花括號(hào)表示一個(gè)選項(xiàng)卡。在這里，有兩個(gè)選項(xiàng)卡。text屬性用于設(shè)置選項(xiàng)卡中的文本提示。

3. 設(shè)置點(diǎn)擊選項(xiàng)卡的跳轉(zhuǎn)頁(yè)面

在tabbar組件中，需要設(shè)置點(diǎn)擊選項(xiàng)卡時(shí)的跳轉(zhuǎn)頁(yè)面。只有設(shè)置為index或logs才會(huì)顯示tabbar。

4. 設(shè)置選中狀態(tài)與未選中狀態(tài)下的圖標(biāo)路徑

最后，設(shè)置tabbar的選中狀態(tài)和未選中狀態(tài)下的圖標(biāo)路徑。

5. 查看效果圖

最后，可以查看設(shè)置的三個(gè)tabbar選項(xiàng)卡的效果圖。