v-for循环使用key值。

Question

需要使用v-for循环数据 但是需要使用数据的key值

数据结构是这样的

{
    "工艺检测项目": [{
        "id": 5,
        "batchid": 1,
        "brandid": 66,
        "smallbrandid": 68,
        "criterionitemid": 9,
        "criterionitemname": "光泽",
        "criterionitemcontent": "5.0",
        "indicatorsid": 8,
        "indicatorsname": "光泽",
        "indicatorsvalue": "0",
        "processid": null,
        "ruleremark": null,
        "remark": null,
        "inputtype": true,
        "isokvalue": -2
    }],
    "感官类项目": [{
        "id": 6,
        "batchid": 1,
        "brandid": 66,
        "smallbrandid": 68,
        "criterionitemid": 10,
        "criterionitemcontent": "30.0",
        "indicatorsid": 7,
        "indicatorsvalue": "0",
        "processid": null,
        "ruleremark": null,
        "remark": null,
        "inputtype": true,
        "isokvalue": -2
    }]
}

循环是这样

<Collapse style="margin-top:3%" v-for="（value,key） in technologyInfo">
            <Panel>
            key
                <span style="font-size:16px"></span>
                <div slot="content">
                    <Collapse v-for="info in value">
                        <Panel  style="font-size:14px">
                            {{info.criterionitemname}}
                            <p slot="content">                          
                                <span style="display:flex;justify-content:space-between;width:100%">{{info.criterionitemname}}：<span>{{info.indicatorsvalue}}分</span></span>
                            </p>
                        </Panel>
    
                    </Collapse>
                </div>
            </Panel>
</Collapse>

这样会报错
我该如何获取到“工艺检测项目和感官类项目”

Answer 1

写成这样的形式： v-for="(value, key, index) in technologyInfo"，key就是你想要的值。

Answer 2

let keysArray = Object.keys(technologyInfo)
let technologyInfoList = [].concat(keysArray.map(t => ({key: t, value: technologyInfo[t]})))

<Collapse style="margin-top:3%" v-for="item in technologyInfoList" />