1 创建 tabBar 分支
运行如下的命令,基于
master
分支在本地创建
tabBar
子分支,用来开发和
tabBar
相关的功能:
git
checkout
-b
tabbar

2 创建 tabBar 页面
在
pages
目录中,创建首页
(home)
、分类
(cate)
、购物车
(cart)
、我的
(my)
这
4
个
tabBar
页面。在
HBuilderX
中,可以通过如下的两个步骤,快速新建页面:
1.
在
pages
目录上鼠标右键,选择
新建页面
2.
在弹出的窗口中,填写
页面的名称
、
勾选
scss
模板
之后,点击创建按钮。截图如下


3 配置 tabBar 效果
1.
将
资料
目录下的
static
文件夹
拷贝一份,替换掉项目根目录中的
static
文件夹
2.
修改项目根目录中的
pages.json
配置文件,新增
tabBar
的配置节点如下:


4.tabBar分支的提交与合并
1. 将本地的 tabbar 分支进行本地的 commit 提交:
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