Lzh正在写代码

小兔鲜儿 - 项目起步效果预览 体验小程序端 体验 H5 端 体验 App 端(安卓) 资料说明📀 视频学习https://www.bilibili.com/video/BV1Bp4y1379L/ 📗 接口文档https://www.apifox.cn/apidoc/shared-0e6ee326-d646-41bd-9214-29dbf47648fa/ ✏️ 在线笔记https://megasu.gitee.io/uni-app-shop-note/ 📦 项目源码https://gitee.com/Megasu/uniapp-shop-vue3-ts/ 项目架构项目架构图 拉取项目模板代码项目模板包含：目录结构，项目素材，代码风格。 模板地址1git clone http://git.itcast.cn/heimaqianduan/erabbit-uni-app-vue3-ts.git heima-shop ::: tip 注意事项小程序真机预览需在 manifest.json...

小兔鲜儿 - 推荐模块主要实现 Tabs 交互、多 Tabs 列表分页加载数据。 动态获取数据参考效果 推荐模块的布局结构是相同的，因此我们可以复用相同的页面及交互，只是所展示的数据不同。 静态结构 新建热门推荐页面文件，并在 pages.json 中添加路由（VS Code 插件自动完成）。 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144//...

小兔鲜儿 - 首页模块涉及知识点：组件通信、组件自动导入、数据渲染、触底分页加载、下拉刷新等。 自定义导航栏参考效果：自定义导航栏的样式需要适配不同的机型。 ::: tip 操作步骤 准备组件静态结构 修改页面配置，隐藏默认导航栏，修改文字颜色 样式适配 -> 安全区域 ::: 静态结构 新建业务组件：src/pages/index/componets/CustomNavbar.vue 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071<script setup lang="ts">//</script><template> <view class="navbar"> <!-- logo文字 --> <view...

小兔鲜儿 - 分类模块用户点击左菜单的一级分类，切换右侧对应的二级分类和商品。 准备工作参考效果 商品分类页中的广告位，可复用之前定义的轮播图组件 XtxSwiper。 静态结构 商品分类页静态结构：...

小兔鲜儿 - 微信登录涉及知识点：微信授权登录，文件上传，Store 状态管理等。 微信登录微信小程序的开放能力，允许开发者获取微信用户的基本信息（昵称、性别、手机号码等），开发者常用来实现注册/登录的功能。 登录方式常见登录/注册方式： 用户名/手机号 + 密码 手机号 +...

小兔鲜儿 - 用户模块在用户登录/注册成功后，展示会员信息，更新会员信息。 会员中心页(我的)主要实现两部分业务： 渲染当前登录会员的昵称和头像，从 Store...

小兔鲜儿 - SKU 模块学会使用插件市场，下载并使用 SKU 组件，实现商品详情页规格展示和交互。 存货单位（SKU）SKU 概念 存货单位（Stock Keeping Unit），库存管理的最小可用单元，通常称为“单品”。 SKU 常见于电商领域，对于前端工程师而言，更多关注 SKU 算法 和 用户交互体验。 插件市场uni-app 插件市场，是 uni-app 官方插件生态集中地。 SKU 属于电商常见业务，插件市场有现成的 SKU 插件，我们下载并在项目中使用。 下载 SKU 插件经过综合评估，我们选择该SKU 插件，请下载插件到本地。 体验地址 ::: tip 常见问题 Q：如何评估第三方插件的质量？ A：查看插件的评分、评价、下载量、更新频率以及文档完整性，以确保插件具有良好的社区口碑、兼容性、性能和维护状况。 ::: 使用 SKU 插件组件安装到自己项目 复制 vk-data-goods-sku-popup 和 vk-data-input-number-box 到项目的根 components...

小兔鲜儿 - 地址模块 能够获取不同类型的表单数据 能够动态设置导航栏的标题 能够使用 uni-ui 组件库的组件 能够完成收货地址的增删改查的功能 准备工作静态结构地址模块共两个页面：地址管理页，地址表单页...

小兔鲜儿 - 购物车模块完成加入购物车，购物车列表交互，计算结算金额等业务。 加入购物车在商品详情页把 选中规格后的商品(SKU) 加入购物车。 接口相关接口详情 接口地址：/member/cart 请求方式：POST 登录权限: 是 请求参数： Body 字段名称 是否必须 默认值 备注 skuId 是 无 商品库存单位 count 是 无 购买商品数量 接口封装 src/services/cart.ts 123456789101112import { http } from "@/utils/http";/** * 加入购物车 * @param data 请求体参数 */export const postMemberCartAPI = (data: { skuId: string; count: number }) => { return http({ method: "POST", url:...

小兔鲜儿 - 项目打包微信小程序端把当前 uni-app 项目打包成微信小程序端，并发布上线。 核心步骤 运行打包命令 pnpm build:mp-weixin 预览和测试，微信开发者工具导入生成的 /dist/build/mp-weixin 目录 上传小程序代码 提交审核和发布 步骤图示项目打包上线需要使用到多个工具，注意工具之间的职责。 1VSCode ----> 微信开发者工具 ----> 微信公众平台 了解：开发者也可独立使用 miniprogram-ci 进行小程序代码的上传等操作。 ::: tip 举一反三 打包成其他小程序端的步骤类似，只是更换了 打包命令 和 开发者工具 。 ::: 条件编译::: tip 常见问题 Q：按照 uni-app 规范开发可保证多平台兼容，但每个平台有自己的一些特性，该如何处理？ A：通过 条件编译，让代码按条件编译到指定平台。 ::: 网页端不支持微信平台授权登录等功能，可通过 条件编译，实现不同端渲染不同的登录界面。 条件编译语法通过特殊注释，以 #ifdef 或 #ifndef 加 平台名称 开头，以...