Python Flet JSON编辑器嵌套数组报错：Unexpected Data Type

问题根源 #

你的问题出在build_json_editor函数对数组（list）的处理逻辑上——要么是没有递归遍历数组内的嵌套元素，要么是类型判断后的UI构建逻辑缺失，导致无法正确渲染嵌套数组内容。

修正方案 #

完善build_json_editor中对list类型的处理逻辑，确保递归遍历每个数组元素并构建对应的UI组件，同时保证JSON加载使用标准库以维持正确的数据类型。

修正后的核心代码

import flet as ft
import json

def build_json_editor(key, value):
    # 处理字典类型
    if isinstance(value, dict):
        dict_container = ft.Column(spacing=2)
        for k, v in value.items():
            dict_container.controls.append(build_json_editor(k, v))
        return ft.ExpansionTile(
            title=ft.Text(f"{key} (Object)"),
            content=dict_container
        )
    # 处理数组类型（重点修正部分）
    elif isinstance(value, list):
        list_container = ft.Column(spacing=2)
        for idx, item in enumerate(value):
            # 用索引作为数组元素的标识，递归构建编辑器
            item_editor = build_json_editor(f"{key}[{idx}]", item)
            list_container.controls.append(item_editor)
        return ft.ExpansionTile(
            title=ft.Text(f"{key} (Array, {len(value)} items)"),
            content=list_container
        )
    # 处理基本数据类型
    else:
        return ft.Row(
            [
                ft.Text(f"{key}: "),
                ft.TextField(value=str(value), width=300)
            ]
        )

# 加载JSON文件的示例逻辑
def load_json_file(page: ft.Page, file_path: str):
    with open(file_path, "r", encoding="utf-8") as f:
        data = json.load(f)
    # 清空页面并添加编辑器
    page.controls.clear()
    page.add(build_json_editor("Root", data))
    page.update()

# Flet应用入口
if __name__ == "__main__":
    def main(page: ft.Page):
        page.title = "JSON Editor"
        # 示例：加载测试JSON文件
        load_json_file(page, "test.json")
    
    ft.app(target=main)

测试用示例JSON（test.json）

{
  "name": "JSON Editor Demo",
  "version": "1.0.0",
  "author": "Auske",
  "config": {
    "auto_save": true,
    "theme": "light"
  },
  "samples": [
    {
      "id": 1,
      "content": "Nested array test",
      "tags": ["python", "flet", "json"]
    },
    {
      "id": 2,
      "content": "Another item",
      "tags": ["dev", "tool", "editor"]
    }
  ]
}

关键说明 #

1. 数组处理逻辑：新增了对list类型的完整处理——创建Column容器遍历数组元素，通过递归调用build_json_editor渲染每个元素，无论是基本类型还是嵌套的dict/list都能正确显示。
2. 数据类型保障：使用Python标准json库加载文件，确保数组被解析为标准list类型，让isinstance(value, list)判断能正常生效。
3. UI交互优化：用ExpansionTile包裹数组和字典，方便展开/折叠查看嵌套内容，提升编辑器的易用性。

内容的提问来源于stack exchange，提问作者Auske