小程序项目练习-tabBar

创建tabbar 子分支

使用git 命令,新建本地分支 tabbar

git checkout -b tabbar
# -b 创建并切换 分支

git status 查看状态
会看到一条 : on branch tabbar 证明当前是在本地的tabbar分支上面

创建 tabBar 页面

1. 在pages文件夹中创建,结构为这样的页面
   
2. 在static文件夹中,准备好自定义的小图标
3. 修改项目根目录中的 pages.json 配置文件, 新增 tabbar 的配置节点

"tabBar": {
    "selectedColor": "#C00000",
    "list": [
      {
        "pagePath": "pages/home/home",
        "text": "首页",
        "iconPath": "static/tab_icons/home.png",
        "selectedIconPath": "static/tab_icons/home-active.png"
      },
      {
        "pagePath": "pages/cate/cate",
        "text": "分类",
        "iconPath": "static/tab_icons/cate.png",
        "selectedIconPath": "static/tab_icons/cate-active.png"
      },
      {
        "pagePath": "pages/cart/cart",
        "text": "购物车",
        "iconPath": "static/tab_icons/cart.png",
        "selectedIconPath": "static/tab_icons/cart-active.png"
      },
      {
        "pagePath": "pages/my/my",
        "text": "我的",
        "iconPath": "static/tab_icons/my.png",
        "selectedIconPath": "static/tab_icons/my-active.png"
      }
    ]
  }

和原有的pages节点 同级,根据自己的情况更改一些路径信息
selectedColor:是选中时,字体的颜色
iconPath: 是未选中时,图标的状态
selectedIconPath:选中时,图标的状态

4. 删除一些,默认配置
   pages目录下,index首页文件夹 删除
   page.json 中,index路径删除
   components目录下的 uni-link 组件文件夹删除
   图标的路径中不要出现中文

嘻嘻

合并子分支

1. 提交本地 **git add . ** 和 git commit -m "提交tabbar分支"
2. 将本地tabbar分支推送到远程git push -u origin tabbar
3. 将本地tabbar分支 合并到本地master主分支中
   git checkout master
   git merge tabbar
4. 删除tabbar分支
   git branch -d tabbar