1.封装数量选择组件 功能分析： 默认值为1 可限制最大最小值 点击-就是减1，点击+就是加1 需要完成v-model的双向数据绑定 存在无label的情况 <script setup> // 组件间的v-model =》父组件绑定:modelValue，监听@update:modelValue import { useVModel } from '@vueuse/co
1. SKU和SPU概念 SPU代表一个商品，这个商品可以拥有很多属性 SKU代表这个商品可选规格的任意组合，是库存单位唯一标识 2. 路径字典 大致步骤 根据后台返回的sku数据得到有效sku组合(inventory > 0) 处理sku数组，使用power-set算法得到sku数组的子集 比如：['蓝色', '中国']
1. 基础布局 完成商品详情基础布局，路由配置，搭好页面架子 2. 渲染面包屑 编写一个钩子函数useGoods.js，将面包屑获取数据的逻辑抽取出来。 // 拿到商品信息 import { findGoods } from '@/api/product' import { nextTick, ref, watch } from 'vue' import { useRoute } from
1. 面板封装 提取首页的公用面板进行复用 头部 标题和副标题由props传入 右侧内容由具名插槽right传入 查看更多封装成全局组件 主体 由默认插槽传入 <template> <!-- 封装面板组件 --> <div class="home-panel"> <div class="container"> <di
1.less自动化导入 安装一个vue-cli插件，自动导入less文件 vue add style-resources-loader 2. 头部分类导航组件渲染 实现头部一级分类和二级分类的渲染 基本步骤： 定义一个常量数据和后台保持一致，这样不请求后台就能展示一级分类，不至于白屏 定义接口函数 在pinia的categ
1.pinia基础 store/modules/user.ts import { defineStore } from 'pinia' // 用户模块 const useUserStore = defineStore('user', { state: () => { return { // 用户信息 profile: {} as UserProfile } }, actions: { // 修改用户
