vue3 json格式化显示数据(vue3-json-viewer) 对比修改前后数据

server/2024/11/13 9:14:52/

在这里插入图片描述

需求:对比变更前后数据

  1. npm包下载
npm install vue3-json-viewer --save
  1. main.ts中全局引用
// json可视化
import JsonViewer from "vue3-json-viewer"
import "vue3-json-viewer/dist/index.css";app.use(JsonViewer).mount("#app");
  1. .vue文件页面使用
<div v-for="(item, index) in JSON.parse(dialogData.oldData)" :key="index"><json-viewer:value="item":expand-depth="5"copyableboxedsortexpanded></json-viewer>
</div> 

http://www.ppmy.cn/server/111721.html

相关文章

Sui Hacker House曼谷站报名开启:在Devcon 2024期间探索Sui区块链创新

Sui 曼谷 Hacker House 报名开启 Sui Bangkok Hacker House 将在曼谷于 2024 年 11 月 4 日至 17 日举办。诚邀开发者深入学习 Move 语言,在 Sui 网络上构建 MVP ,在充满活力的曼谷中度过难忘的两周。 诚挚地邀请开发者加入为期两周的 Sui Bangkok Hacker House。 你将与其他…

今日算法:蓝桥杯基础题之“星系炸弹”

你好同学&#xff0c;我是沐爸&#xff0c;欢迎点赞、收藏、评论和关注。 今日算法第4题&#xff0c;如何布置星系炸弹&#xff0c;一起看看吧。 题目 在X星系的广袤空间中漂浮着许多X星人造“炸弹”&#xff0c;用来作为宇宙中的路标。每个炸弹都可以设定多少天之后爆炸。比…

Python中DrissionPage的详细解析与实战

一、DrissionPage简介 1.1 什么是DrissionPage DrissionPage 是一个集成了 Selenium 和 requests 的 Python 库&#xff0c;具有以下特点&#xff1a; 简化操作&#xff1a;提供了统一的 API&#xff0c;让用户可以在浏览器模式&#xff08;Selenium&#xff09;和无浏览器模…

历经三年磨砺,快手交换机的自研创新之路

导读&#xff1a; 快手自研交换机是2021年初开始立项&#xff0c;坚持软件自主可控 / 硬件生态开放的整体战略&#xff0c;历经三年磨砺&#xff0c;发布扛鼎之作『快手自研51.2T交换机』&#xff0c;是首家引入多元化交换芯片并在数据中心网络中规模化部署&#xff01;更是首…

【深入剖析C++的inline函数:性能优化与常见误区】

一、什么是inline函数&#xff1f; inline函数是一种特殊的函数&#xff0c;它建议编译器在调用该函数时&#xff0c;不是进行通常的函数调用&#xff0c;而是将函数的代码直接插入到调用点。这种方法可以消除函数调用的开销&#xff0c;尤其在小型函数和频繁调用的情况下能显…

第十七章 rust异步库tokio入门

注意 本系列文章已升级、转移至我的自建站点中,本章原文为:rust异步库tokio入门 目录 注意一、前言二、基本理解与使用三、状态共享四、注意事项一、前言 异步是一个非常强大特性,它有相当多的实现模型,其中比较知名的“协程”,go语言的并发编程就是借助的“协程”这一概…

比特币网络和支付

1. 比特币网络 比特币网络是一个去中心化的点对点网络&#xff0c;节点之间可以直接进行交易。网络上有不同类型的节点。 1.1 比特币网络的节点 比特币网络的节点有两种主要类型&#xff1a;全节点也称为完整节点和简单支付验证&#xff08;Simple Payment Verification,SPV)节…

sizeof 关键字实现原理

sizeof 是 C 语言中的一个关键字&#xff0c;它用于计算某个类型或变量所占用的内存大小。sizeof 关键字在编译时由编译器处理&#xff0c;它的实现与具体的编译器和平台有关。 1.sizeof工作原理 在高级层面上&#xff0c;sizeof 的工作原理如下&#xff1a; 编译时计算&…