用 PyQt5 打造一个可视化 JSON 数据解析工具

写代码的日子里，你是不是经常遇到这种情况：

• 接口调试拿到一大串 JSON 数据，嵌套结构看得你头昏脑涨；

• 用 Notepad++ 或 VSCode 打开，缩进很乱，还容易漏字段；

• 想看某个字段的值，还得一层层展开手动找；

• 想提取某个字段，还得去写一段 json.loads() 然后调试。

有没有一种可能，让我们把这些麻烦都变得简单一点？

我用Trae 做了一个有意思的Agent 「Python工程师」。 点击 https://s.trae.com.cn/a/7c5aa9 立即复刻，一起来玩吧！

答案当然是：写一个图形化的 JSON 数据解析器。今天我们就来实现这样一个小工具 ------ 使用 PyQt5 打造一款干净、简洁、实用的 JSON Viewer，它能快速格式化、展示、查找、导出 JSON 数据。

这个工具不光适合自己平时调试接口用，还可以打包给团队成员使用，让测试、产品也能直观查看 JSON 内容，再也不用你帮他们"翻译数据"。

添加图片注释，不超过 140 字（可选）

工具目标：让 JSON 一目了然

这款工具的核心目标很简单：

1. 解析任意 JSON 字符串或文件

2. 以树形结构展示嵌套字段

3. 支持字段搜索、高亮定位

4. 支持复制节点路径和值

5. 支持格式化 / 压缩显示切换

6. 支持导出为 .json、.txt 文件

7. 支持拖拽 JSON 文件直接打开

说白了，它就是程序员调接口、做数据分析时的左膀右臂。

添加图片注释，不超过 140 字（可选）

关键功能拆解

1. JSON 导入与格式校验

用户可以通过三种方式导入 JSON：

• 粘贴到文本框内（手动输入）

• 选择本地 .json 文件打开

• 拖拽 JSON 文件到窗口

程序会实时校验输入是否合法，并提示错误位置。错误提示可以用 PyQt 的 QMessageBox 显示。

2. 树形结构展示（QTreeWidget）

将 JSON 数据递归解析成树形节点，是这个工具的核心。比如这样一段：

{ "id": 123, "name": "Alice", "roles": "admin" }

我们可以通过 QTreeWidgetItem 的递归构造来实现这种嵌套展示。

添加图片注释，不超过 140 字（可选）

3. 字段搜索与高亮

你是否也有过"我记得那个字段叫 token，但忘了在哪"的时刻？加一个"搜索字段"功能，可以极大提升效率：

• 输入关键词，匹配所有包含该关键词的字段名或字段值

• 匹配成功的节点自动展开，并高亮显示

• 支持上下跳转下一个匹配项

这个功能可以用 QTreeWidget 自带的遍历能力配合搜索框实现。

4. 节点右键菜单：复制路径 & 复制值

每个字段都可能是你调试用的关键数据点。右键节点时弹出菜单：

• 复制字段路径（如 user.roles[1]）

• 复制字段值（如 editor）

• 展开/折叠当前节点

路径构造可以通过记录递归过程中的键名拼接实现。

5. 格式化/压缩切换

有些时候我们希望看"结构化"的 JSON，有时候则希望它更紧凑一些。加一个"格式化 / 紧凑"切换按钮即可：

• 格式化显示：带缩进、换行，美观可读

• 紧凑显示：一行 JSON，方便复制传参

这部分可以直接切换显示区的 JSON 字符串视图内容。

6. 导出功能

将当前 JSON 数据导出为 .json、.txt 文件，可以方便和其他人共享结果，或者做调试日志保存。

使用标准 QFileDialog 弹出保存窗口即可完成导出路径选择。

这个 JSON 可视化工具，虽然小巧，但几乎集成了 PyQt5 开发中所有重要知识点：

• 事件绑定

• 树形结构

• 文件处理

• 样式美化

• 异常处理

• 多窗口交互

它既能帮你解决日常开发中的"小痛点"，也能作为个人作品展示你的项目组织能力与用户体验意识。有了它，你再也不用苦哈哈对着 json.loads() 打断点了。