vue使用笛卡尔积算法构建sku表格

1.根据笛卡尔积算法来构建二维数组

• 变量1接收过滤的tag标签，生成二维数组组

• 变量2获取维度名称

判断如果规格长度等于0，直接把规格属性赋空，然后使用笛卡尔积算法将数据进行交叉处理（使用reduce方法，参数1：空的二维数组，参数2：变量2的数据(维度名称标签)，在声明一个空的数组array(用这个空数组去匹配交叉数组),再拿出reduce参数1空的二维数组，forEach循环遍历，在使用forEach遍历变量2数据(维度名称标签)，进行交叉匹配,连接起来添加进array空数组,然后在这个二维数组中重新映射为对象数组,进行拼接数据构建sku表格

// 根据笛卡尔积来构建二维数组，在这个二维数组中重新映射为对象数组，首先过滤
function addTag() {
    // 根据笛卡尔积来构建二维数组，在这个二维数组中重新映射为对象数组
    const specList = formListAdd.value.specificationList//过滤tag标签，生成2维数组: 
    //数组对象中的数组取出，得到一个二维数组（蓝色tag标签）
    const valueList = specList.filter((item: any) => item.values.length).map((item: any) => item.values)
    // 添加name值（黄色tag标签）//获取维度名称，放到数组中 右边
    const titlesList = specList.filter((item: any) => item.title.length).map((item: any) => item.title)
    if (valueList.length == 0) {//如果规格没有这种属性，直接把规格属性赋空
        formListAdd.value.skuList = []
        return
    }
    // 使用笛卡尔积算法将数据进行交叉处理
    var skuArr = valueList.reduce((pre: string[][], next: any[]) => {//pre是一个空的二维数组 next（黄色tag标签）的内容也就是类型
        var array: string[][] = []//用这个空数组去匹配交叉数组
        pre.forEach(item1 => {//拿出空的一维数组
            next.forEach(item2 => {//遍历黄色tag标签内容，也就是交叉匹配
                array.push(item1.concat([item2]))//连接起来添加进array空数组
                return array
            })
        })
        return array
    }, [[]])
    // 进行拼接数据
    //构建sku表格--最终渲染出表格
    let list = skuArr.map((item: any, index: number) => {//根据skuArr来构建对象数组 
        let obj = { //对象将属性值并渲染到sku表格中
            price: formListAdd.va