小程序中的路由配置以及底部导航

小程序的路由配置及底部导航的实现

目标如图：

1. 创建对应的页面：在pages中添加
   
   2：配置路由：在app.json中配置如下代码

{
"pages": [
    "pages/index/index",
    "pages/search/search",
    "pages/shopCart/shopCart",
    "pages/mine/mine"
  ]
}

3. 底部导航的实现,在app.json中添加如下配置

"tabBar": {
   "list": [
     {
       "pagePath": "pages/index/index",
       "text": "首页",
       "iconPath": "static/img/tabBar/home.png",
       "selectedIconPath": "static/img/tabBar/homeA.png"
     },
     {
       "pagePath": "pages/search/search",
       "text": "搜索",
       "iconPath": "static/img/tabBar/search.png",
       "selectedIconPath": "static/img/tabBar/searchA.png"
     },
     {
       "pagePath": "pages/shopCart/shopCart",
       "text": "购物车",
       "iconPath": "static/img/tabBar/shopCart.png",
       "selectedIconPath": "static/img/tabBar/shopCartA.png"
     },
     {
       "pagePath": "pages/mine/mine",
       "text": "我的",
       "iconPath": "static/img/tabBar/mine.png",
       "selectedIconPath": "static/img/tabBar/mineA.png"
     }
   ]

注意点：
1：在json文件中最后一个键值对后边不加","（逗号），会提示报错；
2：引入图片的路径可以是相对地址，也可以是绝对地址
3:样式的调整可以参考官方文档
页面中什么都不用做