如何在 Flask 中将 JSON 字符串转换为 HTML 表？答案

【问题标题】：How to convert JSON String to HTML Table in Flask?如何在 Flask 中将 JSON 字符串转换为 HTML 表？
【发布时间】：2021-05-26 05:41:25
【问题描述】：

我正在尝试将 json 转换为 html 表，但出现错误 UndefinedError: 'unicode object' has no attribute 'items'。我从响应中得到低于 json 的信息，并将其存储到 d5 中，

['{"pf":"K"', '"users":1', '"events":1}', '{"pf":"A"', '"users":7' , '"events":7}', '{"pf":"I"', '"users":3', '"events":3}']

以下是我的代码，

finalJson = json.dumps(d5)
    table_data = (json2html.convert(json = finalJson))
    return render_template_string('''
    <table>
            <tr>
                <td> PF </td> 
                <td> users </td>
                <td> events </td>
            </tr>

    {% for pf, users,events in table_data.items() %}

            <tr>
                <td>{{ pf }}</td> 
                <td>{{ users }}</td>
                <td>{{ events }}</td>
            </tr>
    {% endfor %}
    </table>
''', table_data=table_data)

我想将该 json 转换为 html 表格，例如，

pf	users	events
K	1	1
I	3	3
A	7	7

【问题讨论】：

为什么数据需要是json格式？您可以将其保留为原始形式。
@EpicChen 我从响应中得到那个 json，我想使用它
响应为 ['{"pf":"K"', '"users":1', '"events":1}', '{"pf":"A"' , '"users":7', '"events":7}', '{"pf":"I"', '"users":3', '"events":3}'] 或 [{" pf":"K", "users":1, "events":1}, {"pf":"A", "users":7, "events":7}, {"pf":"I" ，“用户”：3，“事件”：3}]？其实第一个是错误的josn格式发到json.parser.online.fr
其实响应是spark数据帧的输出
我做了一些调查，我认为 spark dataframe 的输出应该是 ['{"pf":"K", "users":1, "events":1},{" pf":"A", "users":7, "events":7},{"pf":"I", "users":3, "events":3}'] ? devrats.com/spark-and-json

标签： html json flask

【解决方案1】：

正如我在上面检查过的，试试这个

        d5 = ['{"pf":"K", "users":1, "events":1},{"pf":"A", "users":7, "events":7},{"pf":"I", "users":3, "events":3}']
        # convert spark json array result to a list.
        finalJson = json.loads("[" + d5[0] + "]") 
    
        return render_template_string('''
        <style>
        table, th, td {
             border: 1px solid black;
        }
        table {
            width:80%;
            border-collapse: collapse;
        }
        td {
            text-align: center
        }
        th:first-child, td:first-child {
            text-align: left
        }
        th:last-child, td:last-child {
            text-align: right
        }
        </style>
        <table>
                <tr>
                    <th> PF </th> 
                    <th> users </th>
                    <th> events </th>
                </tr>
    
        {% for row in table_data %}
    
                <tr>
                    <td>{{ row['pf'] }}</td> 
                    <td>{{ row['users'] }}</td>
                    <td>{{ row['events'] }}</td>
                </tr>
        {% endfor %}
        </table>
    ''', table_data=finalJson)

你也可以随意修改你想要的样式。

【讨论】：

你注意到 d5 不是字符串吗？ d5 是一个数组。 [ xxxxxxx ]，你的意思是你的 d5 = "['{"pf":"K", "users":1, "events":1},{"pf":"A", "users":7, "事件“：7}，{“pf”：“我”，“用户”：3，“事件”：3}']”？目标是在调用 json.load 之前将字符串修改为有效的 json 字符串
谢谢，知道了。但仍然存在一个问题。在 PF 列中，我得到类似 events 事件的行，在 Users 列中，我得到 pf，在 events 列中得到用户。
能否提供截图？
你能给我你的email id，我给你截图
我已经修改了代码，main 在 {% for row in table_data %} 循环部分。而且，字段'events'的原始拼写不正确，我已将其从'events'修改为'events'。

【解决方案2】：

d5='[{"pf":"K","users":1,"events":1},{"pf":"A","users":7,"events":7},{"pf":"I","users":3,"events":3}]'
finalJson = json.loads(d5)

return render_template_string('''
<table>
        <tr>
            <td> PF </td> 
            <td> users </td>
            <td> events </td>
        </tr>

{% for pf, users,events in finalJson %}

        <tr>
            <td>{{ pf }}</td> 
            <td>{{ users }}</td>
            <td>{{ events }}</td>
        </tr>
{% endfor %}
</table>
''', finalJson=finalJson)

首先，字符串 d5 应该具有正确的 json 格式。其次，如果要将字符串转换为json，可以使用json.loads（不是转储）

finalJson 是“列表”。所以你可以在没有 items() 函数的情况下迭代它。

【讨论】：

我觉得你的json也是无效的