0

我是 react native 的菜鸟，我正在编写我的第一个应用程序来读取来自 API 的响应。直到现在我知道如何拨打电话并获取响应并解析状态中数组中的常规回复，但我没有找到正确的方法来解析这种特定形式的 json 回复。我尝试将它保存在一个数组中，但它不起作用。

{
"activities": [
    {
        "id": 19,
        "files": [
            {
                "id": 63,
                "created_at": "15/05/2020 15:09:34",
                "updated_at": "15/05/2020 15:09:34",
                "file": "/media/activities/newFile133.11531268506258.jpg",
                "is_default": false,
                "activity": 19
            },
            {
                "id": 65,
                "created_at": "15/05/2020 15:10:15",
                "updated_at": "15/05/2020 15:10:15",
                "file": "/media/activities/newFile203.0997630588359.jpg",
                "is_default": false,
                "activity": 19
            },
            {
                "id": 64,
                "created_at": "15/05/2020 15:09:53",
                "updated_at": "15/05/2020 15:10:27",
                "file": "/media/activities/newFile193.8056151444231.jpg",
                "is_default": true,
                "activity": 19
            },
            {
                "id": 62,
                "created_at": "15/05/2020 15:08:56",
                "updated_at": "15/05/2020 15:10:27",
                "file": "/media/activities/newFile39.839136995440484.jpg",
                "is_default": false,
                "activity": 19
            }
        ],
        "created_at": "15/05/2020 14:52:54",
        "updated_at": "15/05/2020 14:58:01",
        "title": "Camping",
        "description": "Camp Al Wilayah",
        "category": 10
    },
    {
        "id": 21,
        "files": [
            {
                "id": 66,
                "created_at": "15/05/2020 15:16:02",
                "updated_at": "15/05/2020 15:16:02",
                "file": "/media/activities/newFile46.35084778104737.jpg",
                "is_default": true,
                "activity": 21
            },
            {
                "id": 67,
                "created_at": "15/05/2020 15:16:33",
                "updated_at": "15/05/2020 15:16:33",
                "file": "/media/activities/newFile49.28140513312763.jpg",
                "is_default": false,
                "activity": 21
            }
        ],
        "created_at": "15/05/2020 15:11:22",
        "updated_at": "15/05/2020 15:11:22",
        "title": "Aashoura",
        "description": "Majlis Aazaa",
        "category": 12
    },
    {
        "id": 18,
        "files": [
            {
                "id": 68,
                "created_at": "15/05/2020 15:21:18",
                "updated_at": "15/05/2020 15:21:18",
                "file": "/media/activities/newFile71.35101359514769.jpg",
                "is_default": true,
                "activity": 18
            },
            {
                "id": 69,
                "created_at": "15/05/2020 15:22:42",
                "updated_at": "15/05/2020 15:22:42",
                "file": "/media/activities/newFile107.17719628795922.jpg",
                "is_default": false,
                "activity": 18
            }
        ],
        "created_at": "15/05/2020 14:52:11",
        "updated_at": "15/05/2020 15:17:34",
        "title": "Takliff",
        "description": "Taklif ceremony",
        "category": 7
    },
    {
        "id": 22,
        "files": [
            {
                "id": 70,
                "created_at": "15/05/2020 15:42:18",
                "updated_at": "15/05/2020 15:43:03",
                "file": "/media/activities/97026390_682458148963323_2038839267676913664_n.mp4",
                "is_default": true,
                "activity": 22
            }
        ],
        "created_at": "15/05/2020 15:24:46",
        "updated_at": "15/05/2020 15:24:46",
        "title": "Laylat Qader",
        "description": "Event of Laylat al Qader",
        "category": 6
    },
    {
        "id": 23,
        "files": [
            {
                "id": 73,
                "created_at": "15/05/2020 17:42:43",
                "updated_at": "15/05/2020 17:42:43",
                "file": "/media/activities/newFile47.470692661344614.jpg",
                "is_default": false,
                "activity": 23
            },
            {
                "id": 74,
                "created_at": "15/05/2020 18:30:05",
                "updated_at": "26/05/2020 21:34:09",
                "file": "/media/activities/newFile28.504968134645907.jpg",
                "is_default": false,
                "activity": 23
            },
            {
                "id": 72,
                "created_at": "15/05/2020 15:51:29",
                "updated_at": "15/07/2020 07:49:27",
                "file": "/media/activities/newFile82.57124842095388.jpg",
                "is_default": false,
                "activity": 23
            },
            {
                "id": 71,
                "created_at": "15/05/2020 15:50:59",
                "updated_at": "15/07/2020 07:50:09",
                "file": "/media/activities/newFile3.0461490605067763.jpg",
                "is_default": true,
                "activity": 23
            }
        ],
        "created_at": "15/05/2020 15:50:36",
        "updated_at": "15/07/2020 07:46:38",
        "title": "Zayyana Al Dar",
        "description": "Young generation posts",
        "category": 11
    }
],
"total": 5

}

4

2 回答 2

0

首先，整个响应在对象括号内{}。

所以，response.activities会给出一系列的活动。

然后像这样使用它var x = response.activities

var first = x[0]

var second = x[1]

等等 。

于 2020-07-29T15:42:41.390 回答
0

在 setState 函数之后的“.then”中通过“console.log(this.state.activities)”检查状态中的“活动”数组是我的坏事。我认为代码不会移动到第二个“.then”，除非用第一个完成，所以它以摇滚所说的方式进行解析，但在此之前打印在控制台中。

于 2020-07-29T16:07:26.373 回答