vue 表格数据渲染格式问题。

数据格式如下

let data = [
    {
        "message": "",
        "id": "909c0e3f-75e4-47ab-b1a6-8fffc4f948c3",
        "productname": "雪碧",
        "productcode": "00034",
        "barcode": "",
        "category": "e2ead656-443b-4e6d-b5c2-257687a6a22d",
        "categoryName": "水泥",
        "brand": "3ca06784-de9c-400a-b7b0-826c231bfeaa",
        "brandName": "Apple",
        "spectemplate": "312e36e4-a74d-464c-b165-c3fc03dab03e",
        "spectemplateName": "颜色",
        "measureunit": "f4d9b00e-4f42-4fc8-93a4-79d7820965b1",
        "measureunitName": "分米",
        "listprice": 0,
        "isrecommend": "1",
        "creator": "",
        "lastModifier": "",
        "createdTime": "2021-10-11 14:11:58",
        "lastModifiedTime": "2021-10-11 14:11:58",
        "rightList": [
            {
                "id": "c1f0f07f-5bad-4f31-b9d7-220eca6a11ec",
                "parentId": "909c0e3f-75e4-47ab-b1a6-8fffc4f948c3",
                "attributeName1": "大小1",
                "attributeValue1": "小",
                "attributeName2": "颜色",
                "attributeValue2": "白色",
                "skuCode": "3100",
                "skuName": "饮料1",
                "price": 11,
                "isShelf": "上架",
                "uniqueCategoryKey": "1121"
            },
            {
                "id": "18f0125b-74eb-4ca8-84c1-85381328aeca",
                "parentId": "909c0e3f-75e4-47ab-b1a6-8fffc4f948c3",
                "attributeName1": "大小1",
                "attributeValue1": "小",
                "attributeName2": "颜色",
                "attributeValue2": "红色",
                "skuCode": "3101",
                "skuName": "饮料2",
                "price": 12,
                "isShelf": "上架",
                "uniqueCategoryKey": "1122"
            }
        ],
        "checkList": [
            "{\"id\":\"c1f0f07f-5bad-4f31-b9d7-220eca6a11ec\",\"parentId\":\"909c0e3f-75e4-47ab-b1a6-8fffc4f948c3\",\"attributeName1\":\"大小1\",\"attributeValue1\":\"小\",\"attributeName2\":\"颜色\",\"attributeValue2\":\"白色\",\"skuCode\":\"3100\",\"skuName\":\"饮料1\",\"price\":11,\"isShelf\":\"上架\",\"uniqueCategoryKey\":\"1121\"}",
            "{\"id\":\"18f0125b-74eb-4ca8-84c1-85381328aeca\",\"parentId\":\"909c0e3f-75e4-47ab-b1a6-8fffc4f948c3\",\"attributeName1\":\"大小1\",\"attributeValue1\":\"小\",\"attributeName2\":\"颜色\",\"attributeValue2\":\"红色\",\"skuCode\":\"3101\",\"skuName\":\"饮料2\",\"price\":12,\"isShelf\":\"上架\",\"uniqueCategoryKey\":\"1122\"}"
        ]
    }
]

需要渲染的table，分别取外层的productcode和checkList数组下的skuCode，应该如何能取到，求详细解释

<el-table
                :data="copyLeftData"
                border
                type="index"
                style="width: 100%;margin-top:20px"
                highlight-current-row
                class="tb-edit"
                :default-sort="{ prop: 'date', order: 'descending' }"
              >
                <el-table-column label="商品编号" sortable>
                  <template slot-scope="scope">
                    {{ scope.row.productcode }}
                    <br />
                    <span style="color: #84878c" v-for="(item,index) in copyLeftData.checkList" :key="index">
                      {{ item.skuCode }}
                    </span>
                  </template>
                </el-table-column>

                <el-table-column label="商品名称" sortable>
                  <template slot-scope="scope">
                    {{ scope.row.productname }}
                    <br />
                     <span style="color: #84878c" v-for="(item,index) in copyLeftData.checkList" :key="index">
                      {{ item.skuName }}
                    </span>
                    <!-- <span style="color: #84878c">
                      {{ scope.row.skuName }}
                    </span> -->
                  </template>
                </el-table-column>

                <el-table-column label="备注">
                  <template slot-scope="scope">{{ scope.row.remark }}</template>
                </el-table-column>
              </el-table>

copyLeftData.checkList改成scope.row.checkList

重新定义一个数组，然后把原数组置空，进行push

let copyLeftData = JSON.parse(JSON.stringify(data))
                    copyLeftData =  copyLeftData.filter(items=>items.checkList.length>0)
                    copyLeftData.forEach(item=>{
                        console.log(item)
                        let checkList = JSON.parse(JSON.stringify(item.checkList))
                        item.checkList = [];
                        checkList.forEach(item2=>{
                          if (typeof item2 == "string") {
                             item.checkList.push(JSON.parse(item2))
                            // rightItem = JSON.parse(item2);
                            // console.log(rightItem,'确定数据11111111111')
                          }else{
                            item.checkList.push(item2)
                          }

                        })
                      })