微信小程序学习(四)路由页面配置

创建路由，也就是把我们之前几个示例的页面连起来，可以相互跳转

在app.json添配置  是给主页面添加tab页

代码

{
  "pages": [
    "pages/todo/todo",
    "pages/run/run",
    "pages/jok/jok",
    "pages/event/event",
    "pages/base/base",
    "pages/home/home",
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#54ea7c",
    "navigationBarTitleText": "前端嗷嗷叫",
    "navigationBarTextStyle": "black"
  },
  "tabBar": {
    "color": "#484848",
    "selectedColor": "#16a5e7",
    "list": [
      {
        "pagePath": "pages/run/run",
        "text": "抓包",
        "iconPath": "/images/home.png",
        "selectedIconPath": "/images/home-h.png"
      },
      {
        "pagePath": "pages/todo/todo",
        "text": "计划",
        "iconPath": "/images/home.png",
        "selectedIconPath": "/images/home-h.png"
      },
      {
        "pagePath": "pages/event/event",
        "text": "事件",
        "iconPath": "/images/home.png",
        "selectedIconPath": "/images/home-h.png"
      },
      {
        "pagePath": "pages/base/base",
        "text": "语法",
        "iconPath": "/images/home.png",
        "selectedIconPath": "/images/home-h.png"
      },
      {
        "pagePath": "pages/home/home",
        "text": "组件",
        "iconPath": "/images/study.png",
        "selectedIconPath": "/images/study-h.png"
      }
    ]
  },
  "style": "v2",
  "sitemapLocation": "sitemap.json"
}

 页面效果

详细教程可见微信小程序官方文档

微信开放文档微信开发者平台文档https://developers.weixin.qq.com/miniprogram/dev/framework/