配置 tabBar 效果

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 的开发"

  1. 将本地的 tabbar 分支推送到远程仓库进行保存:

git push -u origin tabbar

  1. 将本地的 tabbar 分支合并到本地的 master 分支:
    git checkout master

git merge tabbar
4. 删除本地的 tabbar 分支:
git branch -d tabbar

相关推荐
渴望成为python大神的前端小菜鸟7 天前
浏览器及其他 面试题
前端·javascript·ajax·面试题·浏览器
chilavert3187 天前
技术演进中的开发沉思-235 Ajax:动态数据(上)
javascript·ajax·okhttp
chilavert31810 天前
技术演进中的开发沉思-228 Ajax: Aptana开发
前端·javascript·ajax
士心凡10 天前
Spark
大数据·ajax·spark
beijingliushao11 天前
100-Spark Local模式部署
大数据·python·ajax·spark
by__csdn12 天前
Ajax与Axios终极对比指南全方位对比解析
前端·javascript·ajax·okhttp·typescript·vue·restful
by__csdn12 天前
Vue3+Axios终极封装指南
前端·javascript·vue.js·http·ajax·typescript·vue
唐古乌梁海12 天前
【AJAX】AJAX详解
前端·ajax·okhttp
Beginner x_u12 天前
从接口文档到前端调用:Axios 封装与实战全流程详解
前端·javascript·ajax·接口·axios
7澄112 天前
Servlet 前后端交互实战(登录/注册案例)
运维·服务器·ajax·servlet·jquery·form·前后端交互