配置tabbar
  • 创建tabbar对应的四个页面和图标准备好

  • 将页面路径配置到pages.json中的pages数组中 ```json { “pages”: [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages

    1.   {
    2.       "path": "pages/index/index",
    3.       "style": {
    4.           "navigationBarTitleText": "黑马商城"
    5.       }
    6.   }
    7.   ,{
    8.       "path" : "pages/cart/cart",
    9.       "style" :                                                                                    
    10.       {
    11.           "navigationBarTitleText": "购物车",
    12.           "enablePullDownRefresh": false
    13.       }
    15.   }
    16.   ,{
    17.       "path" : "pages/member/member",
    18.       "style" :                                                                                    
    19.       {
    20.           "navigationBarTitleText": "会员中心",
    21.           "enablePullDownRefresh": false
    22.       }
    24.   }
    25.   ,{
    26.       "path" : "pages/news/news",
    27.       "style" :                                                                                    
    28.       {
    29.           "navigationBarTitleText": "咨询页面",
    30.           "enablePullDownRefresh": false
    31.       }
    33.   }

    ], “globalStyle”: {

    1.   "navigationBarTextStyle": "white",
    2.   "navigationBarTitleText": "黑马商城",
    3.   "navigationBarBackgroundColor": "#b50e03",
    4.   "backgroundColor": "#F8F8F8"

    }, “tabBar”:{

    1.   "selectedColor":"#b50e03",
    2.   "color":"#ccc",
    3.   "list":[
    4.       {
    5.           "text":"首页",
    6.           "pagePath":"pages/index/index",
    7.           "iconPath":"static/icon/home.png",
    8.           "selectedIconPath":"static/icon/home-active.png"
    9.       },
    10.       {
    11.           "text":"咨询",
    12.           "pagePath":"pages/news/news",
    13.           "iconPath":"static/icon/news.png",
    14.           "selectedIconPath":"static/icon/news-active.png"
    15.       },
    16.       {
    17.           "text":"购物车",
    18.           "pagePath":"pages/cart/cart",
    19.           "iconPath":"static/icon/cart.png",
    20.           "selectedIconPath":"static/icon/cart-active.png"
    21.       },
    22.       {
    23.           "text":"首页",
    24.           "pagePath":"pages/member/member",
    25.           "iconPath":"static/icon/member.png",
    26.           "selectedIconPath":"static/icon/member-active.png"
    27.       }
    28.   ]

    } }

``` image.png
上面完成了4个页面的创建，以及tabbar的创建！