Taro：制作tabBar

• • 一、效果實作代碼
  • 二、目錄結構
  • 三、效果展示

一、效果實作代碼

//app.jsx
//pages中将需要跳轉的頁面添加進來
    pages: [
      'pages/index/index',
      'pages/toggle/toggle'
    ],
    
//添加跳轉選項
    tabBar:{
      //字型顔色
      color:"#2c2c2c",
      // 選擇後字型顔色
      selectedColor: "#1296db",
      //背景顔色
      backgroundColor:"#FFF",
      // 邊框顔色
      borderStyle: 'black',
      list:[
        {
          pagePath:"pages/index/index",
          text:"首頁",
          iconPath:"images/index.png",
          selectedIconPath:"images/index-select.png"
        },
        {
          pagePath:"pages/toggle/toggle",
          text:"測試",
          iconPath:"images/my.png",
          selectedIconPath:"images/my-select.png"
        }
      ]
    }
           

二、目錄結構

三、效果展示