我正在嘗試構建一個簡單的反應應用程式,其中列出了我的飛利浦色調燈泡名稱和狀態(開或關)。我有 API 呼叫導致以下 json。不確定如何提取燈泡名稱和 state.on 狀態。
這是我的 json 結果,它獲取連接到我的色調橋的燈泡串列。當我通過飛利浦色調 API 獲取時,我得到了這個結果。
{
"1": {
"state": {
"on": false,
"bri": 254,
"hue": 50116,
"sat": 248,
"effect": "none",
"xy": [
0.2444,
0.0969
],
"ct": 500,
"alert": "select",
"colormode": "xy",
"mode": "homeautomation",
"reachable": true
},
"swupdate": {
"state": "noupdates",
"lastinstall": "2021-08-19T18:10:44"
},
"type": "Extended color light",
"name": "TV 2",
"modelid": "LCT016",
"manufacturername": "Signify Netherlands B.V.",
"productname": "Hue color lamp",
"capabilities": {
"certified": true,
"control": {
"mindimlevel": 1000,
"maxlumen": 800,
"colorgamuttype": "C",
"colorgamut": [
[
0.6915,
0.3083
],
[
0.1700,
0.7000
],
[
0.1532,
0.0475
]
],
"ct": {
"min": 153,
"max": 500
}
},
"streaming": {
"renderer": true,
"proxy": true
}
},
"config": {
"archetype": "sultanbulb",
"function": "mixed",
"direction": "omnidirectional",
"startup": {
"mode": "safety",
"configured": true
}
},
"uniqueid": "00:17:88:01:03:db:75:df-0b",
"swversion": "1.88.1",
"swconfigid": "47ACF9B2",
"productid": "Philips-LCT016-1-A19ECLv5"
},
"2": {
"state": {
"on": false,
"bri": 254,
"hue": 8417,
"sat": 140,
"effect": "none",
"xy": [
0.4573,
0.4100
],
"ct": 366,
"alert": "select",
"colormode": "ct",
"mode": "homeautomation",
"reachable": true
},
"swupdate": {
"state": "noupdates",
"lastinstall": "2021-08-19T18:10:39"
},
"type": "Extended color light",
"name": "Study",
"modelid": "LCT016",
"manufacturername": "Signify Netherlands B.V.",
"productname": "Hue color lamp",
"capabilities": {
"certified": true,
"control": {
"mindimlevel": 1000,
"maxlumen": 800,
"colorgamuttype": "C",
"colorgamut": [
[
0.6915,
0.3083
],
[
0.1700,
0.7000
],
[
0.1532,
0.0475
]
],
"ct": {
"min": 153,
"max": 500
}
},
"streaming": {
"renderer": true,
"proxy": true
}
},
"config": {
"archetype": "sultanbulb",
"function": "mixed",
"direction": "omnidirectional",
"startup": {
"mode": "safety",
"configured": true
}
},
"uniqueid": "00:17:88:01:03:94:fa:07-0b",
"swversion": "1.88.1",
"swconfigid": "47ACF9B2",
"productid": "Philips-LCT016-1-A19ECLv5"
}
}
uj5u.com熱心網友回復:
您可以使用 將它們映射到陣列中map()。由于 map 僅適用于陣列,并且您的資料是一個物件,因此您可以使用 Object.values 回傳物件值的陣列并在其上使用 map ,如下所示:
const data={1:{state:{on:!1,bri:254,hue:50116,sat:248,effect:"none",xy:[.2444,.0969],ct:500,alert:"select",colormode:"xy",mode:"homeautomation",reachable:!0},swupdate:{state:"noupdates",lastinstall:"2021-08-19T18:10:44"},type:"Extended color light",name:"TV 2",modelid:"LCT016",manufacturername:"Signify Netherlands B.V.",productname:"Hue color lamp",capabilities:{certified:!0,control:{mindimlevel:1e3,maxlumen:800,colorgamuttype:"C",colorgamut:[[.6915,.3083],[.17,.7],[.1532,.0475]],ct:{min:153,max:500}},streaming:{renderer:!0,proxy:!0}},config:{archetype:"sultanbulb",function:"mixed",direction:"omnidirectional",startup:{mode:"safety",configured:!0}},uniqueid:"00:17:88:01:03:db:75:df-0b",swversion:"1.88.1",swconfigid:"47ACF9B2",productid:"Philips-LCT016-1-A19ECLv5"},2:{state:{on:!1,bri:254,hue:8417,sat:140,effect:"none",xy:[.4573,.41],ct:366,alert:"select",colormode:"ct",mode:"homeautomation",reachable:!0},swupdate:{state:"noupdates",lastinstall:"2021-08-19T18:10:39"},type:"Extended color light",name:"Study",modelid:"LCT016",manufacturername:"Signify Netherlands B.V.",productname:"Hue color lamp",capabilities:{certified:!0,control:{mindimlevel:1e3,maxlumen:800,colorgamuttype:"C",colorgamut:[[.6915,.3083],[.17,.7],[.1532,.0475]],ct:{min:153,max:500}},streaming:{renderer:!0,proxy:!0}},config:{archetype:"sultanbulb",function:"mixed",direction:"omnidirectional",startup:{mode:"safety",configured:!0}},uniqueid:"00:17:88:01:03:94:fa:07-0b",swversion:"1.88.1",swconfigid:"47ACF9B2",productid:"Philips-LCT016-1-A19ECLv5"}};
let bulbs = Object.values(data).map(
m=>{return {name: m.name, state: m.state.on}}
);
console.log(bulbs);
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/361529.html
標籤:javascript json 飞利浦色调
上一篇:JQuery搜索不顯示結果
