当前位置: 首页 > news >正文

vue SKU已知sku.tree算出sku.list类目值和id

已知sku.tree算出sku.list类目值和id

在这里插入图片描述

  <van-skuref="sku"v-model="showBase":close-on-click-overlay="closeOnClickOverlay":goods="skuData.goods_info":goods-id="skuData.goods_id":hide-stock="skuData.sku.hide_stock":quota="quota":show-add-cart-btn="showAddCartBtn":sku="skuData.sku"@add-cart="onAddCartClicked"><!-- <template #sku-header><div class="van-sku-actions"><van-buttonsize="large"squaretype="warning"@click="onPointClicked">积分兑换</van-button></div></template> --><template #sku-stepper><!-- <div class="van-sku-actions"><van-buttonsize="large"squaretype="warning"@click="onPointClicked">积分兑换</van-button></div> --></template><!-- <template #sku-actions> --><div slot="sku-actions" class="van-sku-actions"><van-button size="large" square type="warning" @click="define">加入购物车</van-button></div><!-- </template> --></van-sku>
    skuData: {sku: {// 所有sku规格类目与其值的从属关系,比如商品有颜色和尺码两大类规格,颜色下面又有红色和蓝色两个规格值。// 可以理解为一个商品可以有多个规格类目,一个规格类目下可以有多个规格值。tree: [{k: '颜色',k_id: '1',v: [{id: '30349',name: '天蓝色',},{id: '1215',name: '白色',},],k_s: 's1',count: 2,largeImageMode: false, //  是否展示大图模式},{k_id: 123, // 属性idk: '加料', // 属性名is_multiple: true, // 是否可多选v: [{id: 1222, // 属性值idname: '珍珠', // 属性值名price: 1, // 属性值加价text_status: 1, // 属性启用/禁用状态 0 - 禁用,1 - 启用},{id: 1223,name: '椰果',price: 1,text_status: 1,},],k_s: 's2',},{k_id: 124, // 属性idk: '加料', // 属性名is_multiple: true, // 是否可多选v: [{id: 1225, // 属性值idname: '珍珠', // 属性值名price: 1, // 属性值加价text_status: 1, // 属性启用/禁用状态 0 - 禁用,1 - 启用},{id: 1226,name: '椰果',price: 1,text_status: 1,},],k_s: 's3',},],// 所有 sku 的组合列表,如下是:白色1、白色2、天蓝色1、天蓝色2list: [{id: 2259,price: 0, //价格discount: 122,stock_num: 20, //库存goods_id: 946755,},// {//   id: 2250,//   price: 121, //价格//   discount: 123,//   s1: '30349',//   s2: '1223',//   stock_num: 22, //库存//   goods_id: 946756,// },],price: '5.00',stock_num: 227, // 商品总库存none_sku: false, // 是否无规格商品hide_stock: false, // 是否隐藏剩余库存},goods_info: {title: '测试商品A',picture:'https://img.yzcdn.cn/upload_files/2017/03/16/Fs_OMbSFPa183sBwvG_94llUYiLa.jpeg?imageView2/2/w/100/h/100/q/75/format/jpg',},goods_id: '946755',initialSku: {},},
mounted() {// 调用函数生成sku.list组合列表this.generateCombinations(this.skuData.sku.tree,0,{},this.skuData.sku.list)},
  generateCombinations(tree, index, combination, combinations) {if (index === tree.length) {combinations.push(combination)return}const node = tree[index]const v = node.vconst k_s = node.k_sfor (let i = 0; i < v.length; i++) {const value = v[i]const combination1 = {id: this.skuData.sku.list[0].id,price: this.skuData.sku.list[0].price,discount: this.skuData.sku.list[0].discount,stock_num: this.skuData.sku.list[0].stock_num,goods_id: this.skuData.sku.list[0].goods_id,}const newCombination = { ...combination, ...combination1}newCombination[k_s] = value.idthis.skuData.sku.list[i]=newCombinationthis.generateCombinations(tree,index + 1,newCombination,combinations)console.log('最后', tree, index + 1, newCombination, combinations)}},

相关文章:

vue SKU已知sku.tree算出sku.list类目值和id

已知sku.tree算出sku.list类目值和id <van-skuref"sku"v-model"showBase":close-on-click-overlay"closeOnClickOverlay":goods"skuData.goods_info":goods-id"skuData.goods_id":hide-stock"skuData.sku.hide_stoc…...

error C4430 缺少类型说明符 - 假定为 int。注意 C++ 不支持默认 int

出现原因&#xff1a;两个类头文件相互包含 使用声明类代替头文件包含...

Embedding入门介绍以及为什么Embedding在大语言模型中很重要

Embeddings技术简介及其历史概要 在机器学习和自然语言处理中&#xff0c;embedding是指将高维度的数据&#xff08;例如文字、图片、音频&#xff09;映射到低维度空间的过程。embedding向量通常是一个由实数构成的向量&#xff0c;它将输入的数据表示成一个连续的数值空间中…...

暑假刷题第20天--8/3

B-序列的与和_2023河南萌新联赛第&#xff08;四&#xff09;场&#xff1a;河南大学 (nowcoder.com)&#xff08;dfs&#xff09; #include<iostream> #include<string> using namespace std; #define ull unsigned long long int n,k; ull a[21]; ull ans0; int…...

docker容器内的django启动celery任务队列

问题1&#xff1a; celery任务队列一般要使用redis&#xff0c;但是容器内的django要访问本机的redis是十分麻烦的 解决2&#xff1a; 在容器内安装redis&#xff0c;或者单独启动一个redis的容器&#xff0c;我是单独启动一个redis容器 安装redis镜像docker pull redis启动…...

linux文件描述符fd

文件描述符 fd是一个>0 的整数 每打开一个文件&#xff0c;就创建一个文件描述符&#xff0c;通过文件描述符来操作文件 预定义的文件描述符: 0:标准输入&#xff0c;对应于已打开的标准输入设备(键盘) 1:标准输出&#xff0c;对应于已打开的标准输出设备(控制台) 2.标准错误…...

【深度学习】各个开源库总结及实战-总目录

前言 此专栏主要是用MMCV和PaddlePaddle,它们都是优秀的开源库,用于计算机视觉和深度学习任务。MMCV提供了丰富的计算机视觉工具和算法,基于PyTorch框架,适合对PyTorch熟悉的用户。PaddlePaddle是百度开发的深度学习平台,提供易用且高性能的深度学习框架。 此专栏主要包括…...

Unity Shader:闪烁

还是一样的分为UI闪烁和物体闪烁&#xff0c;其中具体可分为&#xff1a;UI闪烁、物体闪烁与半透明闪烁 1&#xff0c;UI闪烁 对于UI 还是一样的&#xff0c;改写UI本身的shader&#xff1a; Shader "UI/YydUIShanShder" {Properties{[PerRendererData] _MainTex(…...

c++开发模式桥接模式

将抽象部分与它的实现部分分离&#xff0c;使它们都可以独立地变化。它是一种对象结构型模式&#xff0c;又称为柄体(Handle and Body)模式或接口(Interface)模式。 #include <iostream> using namespace std;// Abstractionclass Abstraction { public:virtual void Op…...

javaScript 树形结构 递归查询方法。

1. 函数递归定义 程序调用自身的编程技巧称为递归&#xff08; recursion&#xff09;。 2.使用条件 1.存在限制条件&#xff0c;当满足这个限制条件的时候&#xff0c;递归便不再继续。 2.每次递归调用之后越来越接近这个限制条件。 3.既然是自己调用自己&#xff0c;那么整个…...

MySQL语法2

DQL语句介绍 DQL是数据查询语言&#xff0c;用来查询数据库中表的记录 DQL-基本查询语句 SELECT 字段列表 FROM 表名列表 WHERE 条件列表 GROUP BY 分组字段列表 HAVIMG 分组后条件列表 ORDER BY 排列字段列表 LIMIT 分页参数 讲解过程&#xff1a;基本查询、条件查询…...

Mysql on duplicate key update用法及优缺点

在实际应用中&#xff0c;经常碰到导入数据的功能&#xff0c;当导入的数据不存在时则进行添加&#xff0c;有修改时则进行更新&#xff0c; 在刚碰到的时候&#xff0c;一般思路是将其实现分为两块&#xff0c;分别是判断增加&#xff0c;判断更新&#xff0c;后来发现在mysql…...

【Linux】-进程概念之进程优先级(如何去进行调度以及进程切换),还不进来看看??

&#x1f496;作者&#xff1a;小树苗渴望变成参天大树&#x1f388; &#x1f389;作者宣言&#xff1a;认真写好每一篇博客&#x1f4a4; &#x1f38a;作者gitee:gitee✨ &#x1f49e;作者专栏&#xff1a;C语言,数据结构初阶,Linux,C 动态规划算法&#x1f384; 如 果 你 …...

《在细雨中呼喊》阅读笔记

《在细雨中呼喊》阅读笔记 2023年2月5号在家读完&#xff0c;本书就是以作者者回忆的形式来写&#xff0c;男一号叫孙光林&#xff0c;有一个哥哥孙光平&#xff0c;一个弟弟叫孙光明&#xff0c;父亲叫孙光才。书中写了四篇故事。 第一篇写的就是作者对于老家生活的回忆 小的时…...

01-1 搭建 pytorch 虚拟环境

pytorch 管网&#xff1a;PyTorch 一 进入 Anaconda 二 创建虚拟环境 conda create -n pytorch python3.9注意要注意断 VPN切换镜像&#xff1a; 移除原来的镜像 # 查看当前配置 conda config --show channels conda config --show-sources# 移除之前的镜像 conda config --…...

RocketMQ 事务消息

事务消息是 RocketMQ 的高级特性之一 。这篇文章&#xff0c;笔者会从应用场景、功能原理、实战例子三个模块慢慢为你揭开事务消息的神秘面纱。 1 应用场景 举一个电商场景的例子&#xff1a;用户购物车结算时&#xff0c;系统会创建支付订单。 用户支付成功后支付订单的状态…...

Windows安装ElasticSearch

安装环境&#xff1a;java环境。新版本需要安装高版本的java&#xff0c;所有本次安装的为 7.x版本的ElasticSearch 。所以要java11 1、安装java11 2、下载 Elasticsearch 安装包 官网地址&#xff1a;(https://www.elastic.co/cn/) 安装包下载地址&#xff1a;https://www…...

【深度学习】SMILEtrack: SiMIlarity LEarning for Multiple Object Tracking,论文

论文&#xff1a;https://arxiv.org/abs/2211.08824 代码&#xff1a;https://github.com/WWangYuHsiang/SMILEtrack 文章目录 AbstractIntroductionRelated WorkTracking-by-DetectionDetection methodData association method Tracking-by-Attention Methodology架构概述外观…...

【Kubernetes】Kubernetes之二进制部署

kubernetes 一、Kubernetes 的安装部署1. 常见的安装部署方式1.1 Minikube1.2 Kubeadm1.3 二进制安装部署2. K8S 部署 二进制与高可用的区别2.1 二进制部署2.2 kubeadm 部署二、Kubernetes 二进制部署过程1. 服务器相关设置以及架构2. 操作系统初始化配置3. 部署 etcd 集群4. 部…...

京东开源的、高效的企业级表格可视化搭建解决方案:DripTable

DripTable 是京东零售推出的一款用于企业级中后台的动态列表解决方案&#xff0c;项目基于 React 和 JSON Schema&#xff0c;旨在通过简单配置快速生成页面动态列表来降低列表开发难度、提高工作效率。 DripTable 目前包含以下子项目&#xff1a;drip-table、drip-table-gene…...

Cesium1.95中高性能加载1500个点

一、基本方式&#xff1a; 图标使用.png比.svg性能要好 <template><div id"cesiumContainer"></div><div class"toolbar"><button id"resetButton">重新生成点</button><span id"countDisplay&qu…...

AtCoder 第409​场初级竞赛 A~E题解

A Conflict 【题目链接】 原题链接&#xff1a;A - Conflict 【考点】 枚举 【题目大意】 找到是否有两人都想要的物品。 【解析】 遍历两端字符串&#xff0c;只有在同时为 o 时输出 Yes 并结束程序&#xff0c;否则输出 No。 【难度】 GESP三级 【代码参考】 #i…...

【机器视觉】单目测距——运动结构恢复

ps&#xff1a;图是随便找的&#xff0c;为了凑个封面 前言 在前面对光流法进行进一步改进&#xff0c;希望将2D光流推广至3D场景流时&#xff0c;发现2D转3D过程中存在尺度歧义问题&#xff0c;需要补全摄像头拍摄图像中缺失的深度信息&#xff0c;否则解空间不收敛&#xf…...

三体问题详解

从物理学角度&#xff0c;三体问题之所以不稳定&#xff0c;是因为三个天体在万有引力作用下相互作用&#xff0c;形成一个非线性耦合系统。我们可以从牛顿经典力学出发&#xff0c;列出具体的运动方程&#xff0c;并说明为何这个系统本质上是混沌的&#xff0c;无法得到一般解…...

Spring是如何解决Bean的循环依赖:三级缓存机制

1、什么是 Bean 的循环依赖 在 Spring框架中,Bean 的循环依赖是指多个 Bean 之间‌互相持有对方引用‌,形成闭环依赖关系的现象。 多个 Bean 的依赖关系构成环形链路,例如: 双向依赖:Bean A 依赖 Bean B,同时 Bean B 也依赖 Bean A(A↔B)。链条循环: Bean A → Bean…...

Scrapy-Redis分布式爬虫架构的可扩展性与容错性增强:基于微服务与容器化的解决方案

在大数据时代&#xff0c;海量数据的采集与处理成为企业和研究机构获取信息的关键环节。Scrapy-Redis作为一种经典的分布式爬虫架构&#xff0c;在处理大规模数据抓取任务时展现出强大的能力。然而&#xff0c;随着业务规模的不断扩大和数据抓取需求的日益复杂&#xff0c;传统…...

OPENCV图形计算面积、弧长API讲解(1)

一.OPENCV图形面积、弧长计算的API介绍 之前我们已经把图形轮廓的检测、画框等功能讲解了一遍。那今天我们主要结合轮廓检测的API去计算图形的面积&#xff0c;这些面积可以是矩形、圆形等等。图形面积计算和弧长计算常用于车辆识别、桥梁识别等重要功能&#xff0c;常用的API…...

【Axure高保真原型】图片列表添加和删除图片

今天和大家分享图片列表添加和删除图片的原型模板&#xff0c;效果包括&#xff1a; 点击图片列表的加号可以显示图片选择器&#xff0c;选择里面的图片&#xff1b; 选择图片后点击添加按钮&#xff0c;可以将该图片添加到图片列表&#xff1b; 鼠标移入图片列表的图片&…...

Python[数据结构及算法 --- 栈]

一.栈的概念 在 Python 中&#xff0c;栈&#xff08;Stack&#xff09;是一种 “ 后进先出&#xff08;LIFO&#xff09;”的数据结构&#xff0c;仅允许在栈顶进行插入&#xff08;push&#xff09;和删除&#xff08;pop&#xff09;操作。 二.栈的抽象数据类型 1.抽象数…...

ubuntu系统 | docker+dify+ollama+deepseek搭建本地应用

1、docker 介绍与安装 docker安装:1、Ubuntu系统安装docker_ubuntu docker run-CSDN博客 docker介绍及镜像源配置:2、ubuntu系统docker介绍及镜像源和仓库配置-CSDN博客 docker常用命令:3、ubuntu系统docker常用命令-CSDN博客 docker compose安装:4、docker compose-CS…...