如何引用一个json响应的多个子级的子类

Question

目前，我正在尝试使用axios为我的react-native应用程序获取axios的数据。我的目标是在我的应用程序中有多张卡片，上面有“纬度”、“经度”、“名称”、“价格”以及上面的图像。为了渲染卡片，我使用了映射函数。

我编写了一个google-cloud-functions来从我的数据库中获取数据：

const admin = require('firebase-admin');

module.exports = function(req, res) {
  admin.database().ref('locations/').on('value', function(snapshot) {
    res.send(snapshot.val());
  }, err => res.send({ error: err }));
}

答复如下：

{
     "-LXd6BopD1onEMc--1qS": {
        "latitude": xxxx,
        "longitude": xxxx,
        "name": "xxxx",
        "price": "xxx",
        "url": "xxxxx"
    },
    "-LXd7GokGQqkxkhDXJBd": {
        "latitude": xxxx,
        "longitude": xxxx,
        "name": "xxxx",
        "price": "xxxx",
        "url": "xxxxxx"
    },
}

子条目的键/名基本上是未知的，因为我使用"push“将数据放入数据库，这将为每个条目创建唯一的键。

我目前正在使用它来访问数据，但不幸的是，“数据”始终是未定义的。

let { data } = await axios.get(`${ROOT_URL}/getValues`)

所以我有两个问题：

1. 为什么“数据”是未定义的，我如何修复它？
2. 如果第一个问题解决了，我如何从两个孩子那里得到数据，因为我并不明确地知道他们的密钥。我该怎么指证他们？

谢谢你的帮助!

Answer 1

因此，对于的第二个问题，，您正在接收的JSON如下所示

{
     "-LXd6BopD1onEMc--1qS": {
        "latitude": xxxx,
        "longitude": xxxx,
        "name": "xxxx",
        "price": "xxx",
        "url": "xxxxx"
    },
    "-LXd7GokGQqkxkhDXJBd": {
        "latitude": xxxx,
        "longitude": xxxx,
        "name": "xxxx",
        "price": "xxxx",
        "url": "xxxxxx"
    },
}

由firebase生成的键是-LXd6BopD1onEMc--1qS，您的数据对象是针对这些键的。

请使用键获取必须引用数据的数据对象。

假设您收到的JSON位于data变量中，那么您可以使用Object.keys和Object.entries从data变量获取键和数据对象。也可以使用"for in“循环。

var data = {....}  // this data variable holds the json response you received

for (var key in data) {
  var myObj = data[key];
  console.log(myObj);        // object of your data
  console.log(myObj.name);   // name
  console.log(myObj.price);  // price
}

还请记住，您可以通过两种方式引用这些键。

myObj.name或myObj['name']取决于您的密钥的名称。第二种方法在您的键不是有效的javascript变量名时非常有用。

对于的第一个问题，如果您将提供请求、响应代码片段，将是很好的。

否则这条线

let { data } = await axios.get(`${ROOT_URL}/getValues`)

在你的问题中，在技术上应该工作良好，只要url是正确的，或者以其他方式使用，尝试在它周围使用，捕捉和记录错误，或试图安慰你收到的响应。

Answer 2

1.- await axios.get('${ROOT_URL}/getValues')这段代码返回一个承诺，所以您仍然需要解析这个承诺才能从它得到数据

2.-如果你拿回数据，你可以用Object.keys或Object.entries来迭代它。请参阅代码片段

希望这能有所帮助

​

async function request(){
return  await axios.get('https://jsonplaceholder.typicode.com/posts/1');
}

async function makeRequest() {

const {data} = await request(); // this line resolves the promise
console.log(data);

}

makeRequest();


const dummyResponse = {
     "-LXd6BopD1onEMc--1qS": {
        "latitude": 'xxxx',
        "longitude": 'xxxx',
        "name": "xxxx",
        "price": "xxx",
        "url": "xxxxx"
    },
    "-LXd7GokGQqkxkhDXJBd": {
        "latitude": 'xxxx',
        "longitude": 'xxxx',
        "name": "xxxx",
        "price": "xxxx",
        "url": "xxxxxx"
    },
};

Object.keys(dummyResponse).forEach( key => {console.log(key)})
Object.entries(dummyResponse).forEach( entry => {console.log(entry)})

<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.min.js"></script>

​