Vue中显示json格式插件vue-json-viewer

场景：想要获取到的数据，以json的格式展示在页面中。

需要使用插件：vue-json-viewer

安装：npm install vue-json-viewer --save

在 Vue项目中main.js中引入

import JsonViewer from 'vue-json-viewer'
Vue.use(JsonViewer)

在vue文件中直接使用

<json-viewer
        :value="jsonData"   //指定的json数据，在data中声明定义
        :expand-depth="5"
        copyable
        boxed
        sort
      ></json-viewer>

可配置项：

参数	说明	默认值
value	JSON 数据(支持与 v-model使用)	Required
expand-depth	在此深度下，进一步下陷	1
copyable	显示“复制”按钮，可以自定义复制文本只需设置{copy text:'copy'，copiedText:'copied'}或设置为true使用默认的copyText	false
sort	显示前排序键	false
boxed	为component组件添加一个奇特的“盒装”样式	false
theme	添加自定义CSS类以创建主题	jv-light