使用wepy开发微信小程序商城 --- 自定义底部tobBar

前言: 使用wepy搭建的小程序
小程序官方文档：https://developers.weixin.qq.com/miniprogram/dev/

wepy官方文档：https://tencent.github.io/wepy/document.html#/

wepy小程序项目初始化：wepy小程序入门之项目初始化
小程序全局配置: https://developers.weixin.qq.com/miniprogram/dev/framework/config.html#%E5%85%A8%E5%B1%80%E9%85%8D%E7%BD%AE
全局配置写在 app.wpy这个文件中
配置背景色:

config = {
  pages: [
    'pages/home', // 首页
    'pages/category', // 分类
    'pages/cart', // 购物车
    'pages/member' // 会员中心
  ],
  window: {
    backgroundTextStyle: 'light',
    navigationBarBackgroundColor: '#fff',
    navigationBarTitleText: 'WeChat',
    navigationBarTextStyle: 'black'
  },
}

配置tabBar
在config对象里面，window一项下面，接着写代码，如下：

"tabBar": {
  "color": "#999999",
  "selectedColor": "#ff6a3c",
  "backgroundColor": "#ffffff",
  "borderStyle": "black",
  "list": [{
    "pagePath": "pages/home",
    "text": "首页",
    "iconPath": "images/icon_home.png",
    "selectedIconPath": "images/icon_home_active.png"
  }, {
    "pagePath": "pages/category",
    "text": "分类",
    "iconPath": "images/icon_classify.png",
    "selectedIconPath": "images/icon_classify_active.png"
  }, {
    "pagePath": "pages/cart",
    "text": "购物车",
    "iconPath": "images/icon_shop_cart.png",
    "selectedIconPath": "images/icon_shop_cart_active.png"
  }, {
    "pagePath": "pages/member",
    "text": "会员中心",
    "iconPath": "images/icon_info.png",
    "selectedIconPath": "images/icon_info_active.png"
  }]
}

原文链接: https://www.cnblogs.com/cathy1024/p/10303294.html

https://www.cnblogs.com/yk95/p/9597493.html