Question

我已成功查询并将我的数据收集到包含多个Json对象的数组中。

但我的问题是如何在运行Cloud Function URL时在屏幕上显示该数组？

这是我的代码

let returnArr = [];
...
...
...

let result:PendingTransaction = {
                               powerpalUser_id: userID,
                               transaction_id: fn.key,
                               transaction_points: rewardTransaction.transaction_points,
                               transaction_status: rewardTransaction.transaction_status,
                               transaction_date: rewardTransaction.transaction_date,
                               transaction_recipient: rewardTransaction.transaction_recipient
                           };

 returnArr.push(result);

 response.status(200).json(returnArr);

Answer 1

您可以执行以下操作：

在云端功能中，返回returnArr，如下所示：

response.status(200).send(returnArr);

在您的网页中，您将获得一个JavaScript对象，其中数组returnArr将位于此对象的data属性中。

下面是一个网页示例，它调用Cloud Function并在控制台中打印，使用JavaScript，数组项的一些值。

您可以在此JavaScript中执行任何操作，例如：填充表格，为每个项目创建div并编写内容，填充下拉框等。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>SO example</title>

    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

</head>
<body>

<script>

    axios.get('https://us-central1-myprojectname.cloudfunctions.net/date')
        .then(function (response) {

            results = response.data;  // Array

            for (var key in results) {
                if (results.hasOwnProperty(key)) {
                    // Here use the results object as you wish with results[key].property, as illustrated below with the console.log()
                    console.log(key + " -> " + results[key].powerpalUser_id + " - " + results[key].transaction_points  + " - " + results[key].transaction_status);
                }
            }

        })
        .catch(function (error) {
            console.log(error);
        });


</script>

</body>
</html>

请注意，我使用Axios库来调用HTTPS云功能，但当然，您可以使用任何其他适合您需求的方式。

在屏幕上显示Json对象的数组

1 个答案: