Javascript 如何将数组列表的第一个值推送到对象？

我有一个嵌套数组，希望将第一项从其中一个数组推送到state

父数组如下所示

"options": [
            {
                "id": 76,
                "label_en": "Disk Storage",
                "type": "text",
                "product_id": 20,
                "values": [
                    {
                        "id": 133,
                        "name_en": "32 GigByte",
                        "display_value": null,
                        "randam_key": "8596598ED", // this the target value I want to save
                        "option_id": 76
                    },
                    {
                        "id": 134,
                        "name_en": "16 GigByte",
                        "display_value": null,
                        "randam_key": "895454HG",
                        "option_id": 76
                    }
                ]
            },
            {
               .....
            }
    ]

“选项-父对象”数组中的每个对象都有一个

值
数组，
值
数组的每个对象都有一个
randam_键

我想保存values数组中每个对象的第一个随机键值，
同时，我有一个函数，它将所有值存储到一个类似

//result
   bodyQuery =  {
        "product_id": 20,
        "values": {
            "randam_key1": "895454HG",
            "randam_key2": "FFJFOF568",
            "randam_key3": "FDVHFDVD566"
        }
    }

const getUpdatedPrice = (randam_key: string, handleKey: string) => {
    setBodyQuery((prevState) => ({
      ...prevState,
      values: {
        ...prevState.values,
        [handleKey]: randam_key,
      },
    }));
  };

因此，我尝试获取“检查底部的实时代码”键，但我不知道如何在屏幕安装时调用getUpdatedPrice（）按预期保存数据

第二种情况是在迭代数组后保存随机键，当我按下任何项时，我调用
getUpdatedPrice（）
这非常有效，但我需要在屏幕安装时执行此操作
useffect（）

#第二个案例-按预期工作

{options.map((option) => {
     ....
     {option.values.map((value: valueOptionProp, index) => {
          // button
           onPress={()=> getUpdatedPrice(
                     value.randam_key,
                     'randam_key' + (options.indexOf(option) + 1),
                  );
             }
      })}
 })}

实时代码



{/*let optionsArr=[]
options.map（（选项）=>{
选项进行推送（选项值）；
}
*/}
//上述代码的结果是
选项arr=[
[
{
显示值：空，
身份证号码：133，
名称_en:'32千兆字节'，
方案编号：76，
randam_键：“8596598ED”，
},
{
显示值：空，
id:134，
名称_en:'16千兆字节'，
方案编号：76，
randam_键：“895454HG”，
},
],
[
{
显示_值：'#FFF'，
id:135，
姓名：白色，
方案编号：77，
随机键：“FGFFDCF54”，
},
{
显示值：“#85FD”，
id:136，
名称(Golden):"Golden",，
方案编号：77，
随机键：“FFJFOF568”，
},
],
[
{
显示_值：“此处Url图像”，
id:137，
名称：“图像1”，
选项编号：78，
随机键：“HGHVDF84585”，
},
{
显示_值：“此处Url图像”，
身份证号码：138，
名称_en:“图像2”，
选项编号：78，
随机键：“FDVHFDVD566”，
},
],
];
让first_randomKey=optionsArr.map（val=>val[0].randam_key）；
console.log（first_randomKey）；
在最终的代码中存在许多不一致和低效的地方，主要是在使用


Array.prototype.map（）
返回一个新数组，因此声明
optionsArr
，然后使用
map（）
推送它是多余的。但是，当您在下一行中通过调用前面提到的
optionsArr
来分配
第一个随机键时，您可以正确使用它


在最后的
map（）
调用中，您将手动查找当前迭代
\u itemsKeys
的索引，但这是不必要的，因为
map（）是
将其作为回调的第二个参数提供给您。同样，在问题的其他地方，您传递了索引，但即使这样，您也没有使用它，而是手动查找索引



效率低下的主要原因是使用三个
map（）
调用一个可以实现的功能，这里使用访问所需的属性，并利用
map（）
提供的隐式传递的
索引
参数

或者不进行分解

const keys = item.options.map((option, index) => {
  const randam_key = option.values[0].randam_key;
  return getUpdatedPrice(randam_key, 'randam_key' + (index + 1));
});


const item={“options”：[{id:1，值：[{id:133，随机键：“8596598ED”}，{id:134，随机键：“8954hg”，}]}，{id:1，值：[{id:135，随机键：'fgdcf54'，}，}，{id:136，随机键：'FFJFOF568'，}，}，}，}，{id:1，值：{id:137，随机键：'fgdf585'，'fgdcff54'，}，}，}，随机键：'ffdvhdvhd 138，}，{
const getUpdatedPrice=async（键，索引键）=>{
返回[键，索引键]
}
const keys=item.options.map（{values:[{randam_key}]}，index）=>
getUpdatedPrice（随机键，'随机键'+（索引+1））；
承诺。所有（键）。然后（（结果）=>{
console.log（结果）
})；
。作为控制台包装{最大高度：100%！重要；顶部：0；}
const keys = item.options.map((option, index) => {
  const randam_key = option.values[0].randam_key;
  return getUpdatedPrice(randam_key, 'randam_key' + (index + 1));
});