用js写一个获取后端返回list里面值的示例
时间: 2023-12-11 11:05:03 浏览: 38
假设后端返回的数据格式如下:
```json
{
"list": [
{ "name": "Alice", "age": 25 },
{ "name": "Bob", "age": 30 },
{ "name": "Charlie", "age": 35 }
]
}
```
你可以使用 JavaScript 中的 `fetch()` 方法来获取后端返回的数据,然后使用 `forEach()` 方法遍历数组中的每个对象并获取对象中的属性值。以下是一个示例:
```js
fetch('/api/data')
.then(response => response.json())
.then(data => {
data.list.forEach(item => {
console.log(item.name, item.age);
});
})
.catch(error => {
console.error('Error:', error);
});
```
上面的代码中,`fetch('/api/data')` 会发送一个 GET 请求到 `/api/data` 接口,获取后端返回的数据。`response.json()` 方法将响应转换为 JSON 格式的数据。然后使用 `forEach()` 方法遍历数组中的每个对象,打印出对象中的 `name` 和 `age` 属性值。
请注意,这只是一个示例代码,实际使用时需要根据自己的需求进行修改。此外,为了保证代码的安全性和可靠性,建议在实际项目中使用合适的错误处理和安全措施。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)