配置 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

相关推荐
beijingliushao2 小时前
100-Spark Local模式部署
大数据·python·ajax·spark
by__csdn1 天前
Ajax与Axios终极对比指南全方位对比解析
前端·javascript·ajax·okhttp·typescript·vue·restful
by__csdn1 天前
Vue3+Axios终极封装指南
前端·javascript·vue.js·http·ajax·typescript·vue
唐古乌梁海1 天前
【AJAX】AJAX详解
前端·ajax·okhttp
Beginner x_u1 天前
从接口文档到前端调用:Axios 封装与实战全流程详解
前端·javascript·ajax·接口·axios
7澄11 天前
Servlet 前后端交互实战(登录/注册案例)
运维·服务器·ajax·servlet·jquery·form·前后端交互
by__csdn1 天前
Axios封装实战:Vue2高效HTTP请求
前端·javascript·vue.js·ajax·vue·css3·html5
霸道流氓气质2 天前
Jquery中使用ajax传json参数并从SpringBoot后台Controller返回消息
ajax·json·jquery
chilavert3184 天前
技术演进中的开发沉思-219 Ajax:样式与事件
ajax·交互
San30.6 天前
深入理解 JavaScript 异步编程:从 Ajax 到 Promise
开发语言·javascript·ajax·promise