vue-json-viewer 前端展示日志文件 JSON数据

使用npm安装vue-json-viewer

npm install vue-json-viewer --save

在main.js中引入vue-json-viewer 全局注册

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

在需要展示json数据的页面引入

<json-viewer :expand-depth="expand" copyable  boxed sort :value="JSON.parse(value)"></json-viewer>

值得注意的是value值是json数据 通过JSON.parse转换后展示效果如下

写的过程中查看其他文章value的值必须为json,通过JSON.stringify(JSON.parse(value))并不能实现如下效果