微信小程序-配置tabBar

配置tabBar

很多时候，对于about页和weekly页，这样的一级页面，我们希望实现的是在他们之间的快速的任意的切换。

• tabBar-对若干一级页面的入口链接。
• 全局配置app.json
• 新问题引入：原来about页的<navigator>元素点击无效

先去app.json去配置tabBar

它是通过list属性来完成的
list属性的取值是一个对象数组，其中每一个对象对应的是一个tabBar

代码：

"tabBar":{
    "list":[
      {
        "text":"每周推荐",/*显示的文本*/
        "pagePath":"pages/weekly/weekly",/*他所链接的路径就是weekly下面的weekly页面*/
        "iconsPath":"images/icons/weekly.png",/*默认的icons图*/
        "selectedIconPath":"images/icons/weekly-selected.png"/*选中之后的icons图*/
      },
      {
        "text":"关于",
        "pagePath":"pages/about/about",
        "iconPath":"images/icons/about.png",
        "selectedIconPath":"images/icons/about-selected.png"
      }
    ],
"color":#000;/*默认的文本颜色*/
"selectedColor":"#00f"/*被选中后的颜色*/
  }
}

• 而配置完这些之后，我们会发现我们之前配置的navigator元素点击没反应那么这是为什么呢？

因为我们的第一个list把weekly页面配置在了tabBar上，所以我们在about页面上我们点击后所期待的行为，不仅应该包括当前页面（也就是about）要跳转到weekly页面，我们也希望底部的标签栏要做一个切换，要切换到这个weekly页面所对应的第一个tabBar，我们需要把open-typ="switchTab"