• swan.setTabBarItem
  • 方法參數(shù)
    • object 參數(shù)說(shuō)明
  • 示例
    • 圖片示例
    • 代碼示例 1：基本示例
    • 代碼示例 2：切換 tab 時(shí)變化文案
  • 錯(cuò)誤碼
    • Android
    • iOS

swan.setTabBarItem

解釋：動(dòng)態(tài)設(shè)置 tabBar 某一項(xiàng)的內(nèi)容。

創(chuàng)新互聯(lián)是一家從事企業(yè)網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)、行業(yè)門戶網(wǎng)站建設(shè)、網(wǎng)頁(yè)設(shè)計(jì)制作的專業(yè)網(wǎng)站設(shè)計(jì)公司，擁有經(jīng)驗(yàn)豐富的網(wǎng)站建設(shè)工程師和網(wǎng)頁(yè)設(shè)計(jì)人員，具備各種規(guī)模與類型網(wǎng)站建設(shè)的實(shí)力，在網(wǎng)站建設(shè)領(lǐng)域樹(shù)立了自己獨(dú)特的設(shè)計(jì)風(fēng)格。自公司成立以來(lái)曾獨(dú)立設(shè)計(jì)制作的站點(diǎn)1000多家。

方法參數(shù)

Object object

object 參數(shù)說(shuō)明

屬性名	類型	必填	默認(rèn)值	說(shuō)明
index	Number	是		tabBar 的哪一項(xiàng)，從左邊算起
text	String	否		tab 上按鈕文字
iconPath	String	否		圖片絕對(duì)路徑，icon 大小限制為 40KB，建議尺寸為 81px 81px，當(dāng) position 為 top 時(shí)，此參數(shù)無(wú)效，不支持網(wǎng)絡(luò)圖片
selectedIconPath	String	否		選中時(shí)的圖片的絕對(duì)路徑，icon 大小限制為 40KB，建議尺寸為 81px 81px ，當(dāng)position為 top 時(shí)，此參數(shù)無(wú)效
success	Function	否		接口調(diào)用成功的回調(diào)函數(shù)
fail	Function	否		接口調(diào)用失敗的回調(diào)函數(shù)
complete	Function	否		接口調(diào)用結(jié)束的回調(diào)函數(shù)（調(diào)用成功、失敗都會(huì)執(zhí)行）

示例

掃碼體驗(yàn)

代碼示例

請(qǐng)使用百度APP掃碼

圖片示例

代碼示例 1：基本示例

在開(kāi)發(fā)者工具中打開(kāi)

在開(kāi)發(fā)者工具中打開(kāi)

在 WEB IDE 中打開(kāi)

• SWAN
• JS

 
 
 

  
  
  

  
  
  
 
  
  
  
 {{ !hasCustomedItem ? '自定義Tab信息' : '移除自定義信息' }}
  
  
  
 
  
  
  

 
 
 

代碼示例 2：切換 tab 時(shí)變化文案

在開(kāi)發(fā)者工具中打開(kāi)

在開(kāi)發(fā)者工具中打開(kāi)

在 WEB IDE 中打開(kāi)

• JS

 
 
 

  
  
  
Page({
  
  
  
 onTabItemTap(item) {
  
  
  
 console.log('點(diǎn)擊第幾項(xiàng)', item.index);
  
  
  
 if (item.index == 1) {
  
  
  
 this.setTabBarItem(item.index)
  
  
  
 }
  
  
  
 console.log('點(diǎn)擊tab對(duì)應(yīng)的路徑', item.pagePath);
  
  
  
 console.log('點(diǎn)擊tab對(duì)應(yīng)的文本', item.text);
  
  
  
 },
  
  
  
 setTabBarItem(index) {
  
  
  
 swan.setTabBarItem({
  
  
  
 index: index,
  
  
  
 text: '替換文本',
  
  
  
 iconPath: '/images/component_normal.png',
  
  
  
 selectedIconPath: '/images/component_selected.png',
  
  
  
 success: () => {
  
  
  
 console.log('setTabBarItem success');
  
  
  
 },
  
  
  
 fail: err => {
  
  
  
 console.log('setTabBarItem fail', err);
  
  
  
 }
  
  
  
 });
  
  
  
 }
  
  
  
 // 如需更多自定義底部tabBar樣式，請(qǐng)參考swan.setTabBarStyle示例(https://smartprogram.baidu.com/docs/develop/api/show/tabbar_swan-setTabBarStyle/)
  
  
  
});
 
 
 

錯(cuò)誤碼

Android

錯(cuò)誤碼	說(shuō)明
1001	執(zhí)行失敗

iOS

錯(cuò)誤碼	說(shuō)明
202	解析失敗，請(qǐng)檢查參數(shù)是否正確
1002	超過(guò) icon 文件最大值

當(dāng)前標(biāo)題：創(chuàng)新互聯(lián)百度小程序教程：swan.setTabBarItem
文章位置：http://www.dlmjj.cn/article/djsshhg.html