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)}},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/80885.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

css在线代码生成器

这里收集了许多有意思的css效果在线代码生成器适合每一位前端开发者 布局&#xff0c;效果类&#xff1a; 网格生成器https://cssgrid-generator.netlify.app/ CSS Grid Generator可帮助开发人员使用CSS Grid创建复杂的网格布局。网格布局是创建Web页面的灵活和响应式设计的强…

分布式应用:Zabbix自定义监控模板

目录 一、理论 1.zabbix监控模板 2.在客户端创建自定义 key 3.在 Web 页面创建自定义监控项模板 4.设置邮件报警 二、实验 1.在客户端创建自定义 key 2.在 Web 页面创建自定义监控项模板 3.设置邮件报警 三、问题 1.查看动作发送邮件失败 四、总结 一、理论 1.zab…

Django Rest_Framework(二)

文章目录 1. http请求响应1.1. 请求与响应1.1.1 Request1.1.1.1 常用属性1&#xff09;.data2&#xff09;.query_params3&#xff09;request._request 基本使用 1.1.2 Response1.1.2.1 构造方式1.1.2.2 response对象的属性1&#xff09;.data2&#xff09;.status_code3&…

Python中的PDF文本提取:使用fitz和wxPython库(带进度条)

引言&#xff1a; 处理大量PDF文档的文本提取任务可能是一项繁琐的工作。本文将介绍一个使用Python编写的工具&#xff0c;可通过简单的操作一键提取大量PDF文档中的文本内容&#xff0c;极大地提高工作效率。 import wx import pathlib import fitzclass PDFExtractor(wx.Fr…

[Vulnhub] matrix-breakout-2-morpheus

目录 <1> 信息收集 <2> getshell <3> Privilege Escalation&#xff08;提权&#xff09; <1> 信息收集 nmap -sP 192.168.236.0/24 扫描一下靶机ip 靶机ip: 192.168.236.154 nmap -A -p 1-65535 192.168.236.154 扫描一下靶机开放哪些服务 开放…

IMV8.0

一、背景内容 经历了多个版本&#xff0c;基础内容在前面&#xff0c;可以使用之前的基础环境&#xff1a; v1&#xff1a; https://blog.csdn.net/wtt234/article/details/132139454 v2&#xff1a; https://blog.csdn.net/wtt234/article/details/132144907 v3&#xff1a; h…

无涯教程-Lua - nested语句函数

Lua编程语言允许在另一个循环中使用一个循环。以下部分显示了一些示例来说明这一概念。 nested loops - 语法 Lua中嵌套for循环语句的语法如下- for init,max/min value, increment dofor init,max/min value, incrementdostatement(s)endstatement(s) end Lua编程语言中的…

使用TDOSCommand调用Powershell脚本对进程进行操作

列出当前运行的进程&#xff1a; varPowerShellPath, ScriptPath, CommandLine: string; beginMemo6.Clear;PowerShellPath : powershell.exe ; // 假设 PowerShell 可执行文件在系统环境变量中// 构造命令行参数CommandLine : Get-Process | Select-Object Name,Id;// 设置命…

Python-OpenCV 图像的基础操作

图像的基础操作 获取图像的像素值并修改获取图像的属性信息图像的ROI区域图像通道的拆分及合并图像扩边填充图像上的算术运算图像的加法图像的混合图像的位运算 获取图像的像素值并修改 首先读入一副图像&#xff1a; import numpy as np import cv2# 1.获取并修改像素值 # 读…

国内大模型在局部能力上已超ChatGPT

中文大模型正在后来居上&#xff0c;也必须后来居上。 数科星球原创 作者丨苑晶 编辑丨大兔 从GPT3.5彻底出圈后&#xff0c;大模型的影响力开始蜚声国际。一段时间内&#xff0c;国内科技公司可谓被ChatGPT按在地上打&#xff0c;毫无还手之力。 彼时&#xff0c;很多企业…

STM32 低功耗学习

STM32 电源系统结构介绍 电源系统&#xff1a;VDDA供电区域、VDD供电区域、1.8V供电区域、后备供电区域。 器件的工作电压&#xff08;VDD&#xff09;2.0~3.6V 为了提高转换精度&#xff0c;给模拟外设独立供电。电压调节器为1.8V供电区域供电&#xff0c;且1.8V供电区域是电…

【基于IDEA + Spark 3.4.1 + sbt 1.9.3 + Spark MLlib 构建逻辑回归鸢尾花分类预测模型】

逻辑回归进行鸢尾花分类的案例 背景说明&#xff1a; 基于IDEA Spark 3.4.1 sbt 1.9.3 Spark MLlib 构建逻辑回归鸢尾花分类预测模型&#xff0c;这是一个分类模型案例&#xff0c;通过该案例&#xff0c;可以快速了解Spark MLlib分类预测模型的使用方法。 依赖 ThisBui…

Spring学习笔记——2

Spring学习笔记——2 1、Bean的基本注解开发1.1、注解版本和Component简介1.2、Component使用1.3、Component的三个衍生注解 二、Bean依赖注入注解开发2.1、依赖注入相关注解2.2、Autowired扩展 三、非自定义Bean注解开发四、Bean配置类的注解开发五、Spring注解的解析原理六、…

W6100-EVB-PICO作为TCP Client 进行数据回环测试(五)

前言 上一章我们用W6100-EVB-PICO开发板通过DNS解析www.baidu.com&#xff08;百度域名&#xff09;成功得到其IP地址&#xff0c;那么本章我们将用我们的开发板作为客户端去连接服务器&#xff0c;并做数据回环测试&#xff1a;收到服务器发送的数据&#xff0c;并回传给服务器…

Grafana集成prometheus(2.Grafana安装)

查找镜像 docker search grafana下载指定版本 docker pull grafana/grafana:10.0.1启动容器脚本 docker run -d -p 3000:3000 --namegrafana grafana/grafana:10.0.1查看是否启动 docker ps防火墙开启 检查防火墙3000端口是否开启 默认用户及密码 admin/admin 登录 ht…

【Docker】Docker中network的概要、常用命令、网络模式以及底层ip和容器映射变化的详细讲解

&#x1f680;欢迎来到本文&#x1f680; &#x1f349;个人简介&#xff1a;陈童学哦&#xff0c;目前学习C/C、算法、Python、Java等方向&#xff0c;一个正在慢慢前行的普通人。 &#x1f3c0;系列专栏&#xff1a;陈童学的日记 &#x1f4a1;其他专栏&#xff1a;CSTL&…

Win7 专业版Windows time w32time服务电脑重启后老是已停止

环境&#xff1a; Win7 专业版 问题描述&#xff1a; Win7 专业版Windows time w32time服务电脑重启后老是已停止 解决方案&#xff1a; 1.检查启动Remote Procedure Call (RPC)、Remote Procedure Call (RPC) Locator&#xff0c;DCOM Server Process Launcher这三个服务是…

MYSQL常见面试题汇总

Yan-英杰的主页 悟已往之不谏 知来者之可追 C程序员&#xff0c;2024届电子信息研究生 目录 1、三大范式 2、DML 语句和 DDL 语句区别 3、主键和外键的区别 4、drop、delete、truncate 区别 5、基础架构 6、MyISAM 和 InnoDB 有什么区别&#xff1f; 7、推荐自增id作…

冒泡排序 简单选择排序 插入排序 快速排序

bubblesort 两个for循环&#xff0c;从最右端开始一个一个逐渐有序 #include <stdio.h> #include <string.h> #include <stdlib.h>void bubble(int *arr, int len); int main(int argc, char *argv[]) {int arr[] {1, 2, 3, 4, 5, 6, 7};int len sizeof(…

人民日报点赞!十大央媒争相报道,星恒守护民生安全出行二十年

围绕电动自行车锂电池的安全性话题&#xff0c;甚至说争议&#xff0c;在近期有了权威定调。 就在7月底&#xff0c;“民生出行&#xff0c;安全为本——电动自行车锂电安全调研座谈会”在北京人民日报社举行&#xff0c;国家监管部门、行业协会、检验院所的权威领导专家&#…